diff --git a/src/components/NoteEditor.tsx b/src/components/NoteEditor.tsx
index f50279c..9cecb8b 100644
--- a/src/components/NoteEditor.tsx
+++ b/src/components/NoteEditor.tsx
@@ -24,6 +24,12 @@ interface NoteEditorProps {
 
 const imageCache = new Map<string, string>();
 
+// Configure marked to support task lists
+marked.use({
+  gfm: true,
+  breaks: true,
+});
+
 
 export function NoteEditor({ note, onUpdateNote, onToggleFavorite, onUnsavedChanges, categories, isFocusMode, onToggleFocusMode, editorFont = 'Source Code Pro', editorFontSize = 14, previewFont = 'Merriweather', previewFontSize = 16, api }: NoteEditorProps) {
   const [localContent, setLocalContent] = useState('');
diff --git a/src/index.css b/src/index.css
index a3f79e3..1ce21b5 100644
--- a/src/index.css
+++ b/src/index.css
@@ -213,3 +213,29 @@ code {
 .dark .ProseMirror hr {
   border-top-color: #374151;
 }
+
+/* Task list styling for preview mode */
+.prose ul li:has(> input[type="checkbox"]) {
+  list-style: none;
+  margin-left: -1.5em;
+  display: flex;
+  align-items: flex-start;
+}
+
+.prose ul:has(li > input[type="checkbox"]) {
+  list-style: none;
+  padding-left: 1.5em;
+}
+
+.prose input[type="checkbox"] {
+  width: 1.25rem;
+  height: 1.25rem;
+  margin-right: 0.75rem;
+  margin-top: 0.32rem;
+  cursor: default;
+  flex-shrink: 0;
+}
+
+.prose input[type="checkbox"]:checked {
+  accent-color: #16a34a;
+}