Monaco editors, the Svelte way
Drop-in Svelte 5 components for modern-monaco: code and markdown editors with Shiki highlighting, workspaces, lazy loading, and SSR.
bun add modern-monaco-svelte modern-monacoMarkdown editor
Formatting shortcuts, snippet completions, list continuation, live bold/italic styling.
Loading editor…
Generic code editor
A thin wrapper over Monaco with two-way bind:value and reactive theming. Pass options={{ readOnly: true }} to lock editing and use it as a syntax-highlighted
code block.
Loading editor…
More demos
Diff Side-by-side diff editor with two-way binding on both sides.Multi-file workspace Virtual filesystem, reactive file explorer, VS Code-style prompts, history trail.IntelliSense Go to definition, rename across files, quick fixes and inlay hints via the built-in LSP.Multi-cursor Linked tag editing, workspace-wide occurrence highlighting, signature help.Theme switcher Swap between a dozen Shiki themes live, on one editor.Visual aids Inline color swatches, Trojan Source detection, bracket and indent guides.Conveniences Drag-and-drop text, word-based suggestions, format on paste and type.Lazy + SSR Server-rendered highlighting that hydrates into a live editor.