diff --git a/packages/web/components/patterns/HighlightNotes.tsx b/packages/web/components/patterns/HighlightNotes.tsx
index 3206e4b47..d72ef91b5 100644
--- a/packages/web/components/patterns/HighlightNotes.tsx
+++ b/packages/web/components/patterns/HighlightNotes.tsx
@@ -256,7 +256,7 @@ export function MarkdownNote(props: MarkdownNote): JSX.Element {
               p: '10px',
               width: '100%',
               marginTop: '15px',
-              color: '$thHighContrast',
+              color: '#3D3D3D',
               bg: '#F5F5F5',
               '> *': {
                 m: '0px',
diff --git a/packages/web/components/patterns/HighlightView.tsx b/packages/web/components/patterns/HighlightView.tsx
index 5ebc151d3..66c2aea11 100644
--- a/packages/web/components/patterns/HighlightView.tsx
+++ b/packages/web/components/patterns/HighlightView.tsx
@@ -31,7 +31,7 @@ export function HighlightView(props: HighlightViewProps): JSX.Element {
   const [isEditing, setIsEditing] = useState(false)
 
   const lines = useMemo(
-    () => props.highlight.quote.split('\n'),
+    () => (props.highlight.quote || '').split('\n'),
     [props.highlight.quote]
   )
 
diff --git a/packages/web/components/templates/article/HighlightsLayer.tsx b/packages/web/components/templates/article/HighlightsLayer.tsx
index 9cb399df6..c288e12ee 100644
--- a/packages/web/components/templates/article/HighlightsLayer.tsx
+++ b/packages/web/components/templates/article/HighlightsLayer.tsx
@@ -518,7 +518,7 @@ export function HighlightsLayer(props: HighlightsLayerProps): JSX.Element {
     }
 
     const copy = async () => {
-      if (focusedHighlight) {
+      if (focusedHighlight && focusedHighlight.quote) {
         if (window.AndroidWebKitMessenger) {
           window.AndroidWebKitMessenger.handleIdentifiableMessage(
             'writeToClipboard',
diff --git a/packages/web/components/templates/article/NotebookModal.tsx b/packages/web/components/templates/article/NotebookModal.tsx
index 082dc8040..c4d2e4432 100644
--- a/packages/web/components/templates/article/NotebookModal.tsx
+++ b/packages/web/components/templates/article/NotebookModal.tsx
@@ -316,7 +316,7 @@ export function NotebookModal(props: NotebookModalProps): JSX.Element {
             top: '0px',
             height: '50px',
             p: '20px',
-            bg: '$thBackground',
+            bg: '$grayBg',
             zIndex: 10,
           }}
         >
diff --git a/packages/web/components/templates/homeFeed/HighlightItem.tsx b/packages/web/components/templates/homeFeed/HighlightItem.tsx
index def16c5e0..8809411de 100644
--- a/packages/web/components/templates/homeFeed/HighlightItem.tsx
+++ b/packages/web/components/templates/homeFeed/HighlightItem.tsx
@@ -49,7 +49,7 @@ export function HighlightItem(props: HighlightItemProps): JSX.Element {
   const [isEditing, setIsEditing] = useState(false)
 
   const lines = useMemo(
-    () => props.highlight.quote.split('\n'),
+    () => (props.highlight.quote || '').split('\n'),
     [props.highlight.quote]
   )
 
diff --git a/packages/web/lib/networking/fragments/highlightFragment.ts b/packages/web/lib/networking/fragments/highlightFragment.ts
index fe8634916..a6cf2e4c6 100644
--- a/packages/web/lib/networking/fragments/highlightFragment.ts
+++ b/packages/web/lib/networking/fragments/highlightFragment.ts
@@ -31,7 +31,7 @@ export type Highlight = {
   id: string
   type: HighlightType
   shortId: string
-  quote: string
+  quote?: string
   prefix?: string
   suffix?: string
   patch: string