diff --git a/src/lib/editor/Editor.svelte b/src/lib/editor/Editor.svelte
new file mode 100644
index 0000000..8f972b0
--- /dev/null
+++ b/src/lib/editor/Editor.svelte
@@ -0,0 +1,36 @@
+<script lang="ts">
+  import { onMount, onDestroy } from 'svelte';
+  import { Editor } from '@tiptap/core';
+  import { extensions } from './extensions';
+  import { saveDocument, loadDocument } from '../storage/autosave';
+  import '../../styles/editor.css';
+
+  let { editor = $bindable() }: { editor: Editor | null } = $props();
+
+  let element: HTMLDivElement;
+
+  onMount(() => {
+    const saved = loadDocument();
+
+    editor = new Editor({
+      element,
+      extensions,
+      content: saved || undefined,
+      onTransaction: () => {
+        // Force Svelte reactivity update
+        editor = editor;
+      },
+      onUpdate: ({ editor: e }) => {
+        saveDocument(e.getJSON());
+      },
+    });
+  });
+
+  onDestroy(() => {
+    editor?.destroy();
+  });
+</script>
+
+<div class="editor">
+  <div bind:this={element}></div>
+</div>