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

NamePackage
Emacs@replit/codemirror-emacs
Vim@replit/codemirror-vim
VS Code@replit/codemirror-vscode-keymap

Language Support

LanguagePackage
Clojureclojure-mode
Elixircodemirror-lang-elixir
GolfScriptcodemirror-lang-golfscript
GraphQLcm6-graphql
Graphvizcm-lang-dot or @viz-js/lang-dot
Handlebars@xiechao/codemirror-lang-handlebars
HCLcodemirror-lang-hcl
HTTPcodemirror-lang-http
Jcodemirror-lang-j
Janetcodemirror-lang-janet
JSON Schemacodemirror-json-schema
Julia@plutojl/lang-julia
Liquidcodemirror-lang-liquid
Nix@replit/codemirror-lang-nix
Rcodemirror-lang-r
Solidity@replit/codemirror-lang-solidarity
Sparqlcodemirror-lang-sparql
Svelte@replit/codemirror-lang-svelte
WGSLcodemirror-lang-wgsl

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.
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.

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.