Community Packages
This page lists CodeMirror-related packages maintained by the wider community. Note that the CodeMirror maintainers make no claims about the quality or fitness-for-purpose of any of these. See below for instructions on helping maintain this page.
Key Bindings
Name | Package |
---|---|
Emacs | @replit/codemirror-emacs |
Vim | @replit/codemirror-vim |
VS Code | @replit/codemirror-vscode-keymap |
Language Support
Themes
- thememirror
- Large collection of editor themes. With theme editor.
- @ddietr/codemirror-themes
- A collection (material, solarized, dracula, github, aura) of themes.
- @codemirror/theme-one-dark
- One-dark theme. Also suitable as an example for writing a new theme.
Editor Extensions
- @uiw/codemirror-extensions-color
- Pops up an interactive color picker over color codes in the document.
- @uiw/codemirror-extensions-hyper-link
- Make links inside the editor followable.
- @replit/codemirror-indentation-markers
- Displays indentation guides/markers on indented lines.
- @marimo-team/codemirror-languageserver
- Integrate the editor with an LSP server over a web socket.
- @uiw/codemirror-extensions-line-numbers-relative
- Count line numbers relative to the line that has the cursor.
- @lqv/codemirror
- CodeMirror plugin for the Liqvid web-based video format. See also @lqv/codebooth.
- @uiw/codemirror-extensions-mentions
- Add completable @-mentions in CodeMirror.
- @emmetio/codemirror6-plugin
- Emmet HTML and CSS expansion.
- y-codemirror.next
- Yjs-based collaborative editing plugin.
- @A99US/codemirror-6-snippetbuilder
- Convert snippets from other app (like this one) to be used in CodeMirror 6.
- @jurjanpaul/codemirror6-parinfer
- Integrates Parinfer: structural Lisp editing by indentation.
Wrappers and Framework Integration
- prosemirror-codemirror-block
- Editor code blocks in a ProseMirror editor using CodeMirror.
- @uiw/react-codemirror
- React component wrapping an editor view.
- @remirror/extension-codemirror6
- Integration of CodeMirror into the Remirror rich text editor.
- solid-codemirror
- CodeMirror integration for SolidJS.
- svelte-codemirror-editor
- Svelte component for CodeMirror.
- vue-codemirror
- Vue 3 component for CodeMirror.
- @A99US/CM6-Browser-Wrapper
- Utility for loading CodeMirror without bundling, as a separate
<script>
tag. - @acrodata/code-editor
- Angular component for CodeMirror 6.
Contributing to this Page
If you spot a problem or want to add a link to this page, please open a pull request on GitHub updating this HTML document.
Welcome additions are open source packages that implement some non-trivial functionality around CodeMirror 6 and that are maintained and fully implemented. If you have some hot new half-baked idea, please let it mature a bit before submitting here.
Note that this page sets a noindex/nofollow meta tag so submitting links in the hope of improving your search rankings is futile.