CM Code Editor

approved

by gapmiss

Code file editor with syntax highlighting and code folding. - This plugin has not been manually reviewed by Obsidian staff.

3 stars139 downloadsUpdated 11d agoMIT

CM Code Editor

A code file editor for Obsidian with syntax highlighting, code folding, and autocompletion. Powered by CodeMirror 6.

Editor & Create modalSettings
demosettings UI

[!NOTE]

Requires Obsidian version 1.13.0+

Installation

Install from community.obsidian.md

From Obsidian's settings or preferences:

  1. Community Plugins > Browse
  2. Search for "CM Code Editor"

Manually:

  1. download the latest release archive
  2. uncompress the downloaded archive
  3. move the cm-code-editor folder to /path/to/vault/.obsidian/plugins/
  4. Settings > Community plugins > reload Installed plugins
  5. enable plugin

or:

  1. download main.js, manifest.json & styles.css from the latest release
  2. create a new folder /path/to/vault/.obsidian/plugins/cm-code-editor
  3. move all 3 files to /path/to/vault/.obsidian/plugins/cm-code-editor
  4. Settings > Community plugins > reload Installed plugins
  5. enable plugin

Features

  • Syntax highlighting for 25+ languages
  • 45+ syntax themes (Dracula, GitHub, Monokai, Nord, Solarized, VS Code, and more) or inherit from your Obsidian theme
  • Autocompletion with built-in language completions for JavaScript, TypeScript, CSS, HTML, SQL, and Python
  • Code folding with gutter controls
  • Indent guides with vertical markers at each indent level
  • Line numbers with active line highlighting
  • Configurable tab size (2 or 4 spaces)
  • Search and replace (Ctrl/Cmd+F) with match case, regex, and whole word toggles
  • Bracket matching and auto-closing
  • Multiple cursors and rectangular selection (Alt+drag)
  • Font size zoom with Ctrl/Cmd+scroll
  • Create code file command and context menu action with configurable default folder
  • Configurable file extensions, font family, and font size

Supported languages

LanguageExtensions
TypeScript.ts .tsx .mts .cts
JavaScript.js .jsx .mjs .cjs
Python.py .pyw .pyi
CSS/SCSS/Less.css .scss .less
HTML.html .htm .svelte .vue
JSON.json .jsonc .jsonl
Markdown.md .markdown
XML.xml .svg .xsl .xsd
SQL.sql
YAML.yaml .yml
Rust.rs
Go.go
C/C++.c .h .cpp .hpp .cc .cxx .hxx
Java.java
PHP.php
Shell.sh .bash .zsh
Ruby.rb .ruby
Lua.lua
TOML.toml
R.r .rmd
PowerShell.ps1 .psm1
DockerfileDockerfile
Swift.swift

Settings

Files

SettingDescriptionDefault
File extensionsComma-separated list of extensions to open with this editorts, js, py, css, ...
Default folderDefault folder for new code files (with fuzzy search)Vault root

Editor

SettingDescriptionDefault
Line numbersShow line numbers in the gutterOn
Code foldingEnable fold guttersOn
Word wrapWrap long lines to the editor widthOff
Tab sizeNumber of spaces per indent level (2 or 4)4
Indent guidesShow vertical lines at each indent levelOff

Theme

SettingDescriptionDefault
Syntax themeChoose from 45+ themes or inherit from ObsidianObsidian (default)

Font

SettingDescriptionDefault
Font sizeFont size in pixels (5-30), also adjustable with Ctrl+scroll14
Font familyCSS font-family value (empty inherits from Obsidian)

License

MIT

For plugin developers

Search results and similarity scores are powered by semantic analysis of your plugin's README. If your plugin isn't appearing for searches you'd expect, try updating your README to clearly describe your plugin's purpose, features, and use cases.