Catppuccin for CodeMirrorv5
🌻 Latte
🪴 Frappé
🌺 Macchiato
🌿 Mocha
From the official CodeMirror docs,
You must make sure the desired CSS file defining the corresponding .cm-s-[name] styles is loaded (see the theme directory in the distribution).
- Make sure to add desired css file to your project by copying it from this repository
- Set CodeMirror editor instance's
themeoption to the name corresponding to your palette choice from following table.
const editor = CodeMirror.fromTextArea(document.getElementById("code"));
editor.setOption("theme", "ctp-mocha"); // set theme to Catppuccin MochaCheck out the demo for reference.
| Palette | Name |
|---|---|
| Latte | ctp-latte |
| Frappé | ctp-frappe |
| Macchiato | ctp-macchiato |
| Mocha | ctp-mocha |
- Q: Will this work with latest version of CodeMirror (v6)?
A: No. It will need additional work to port v6.
Current Maintainer(s)
Inspiration and Contribution
- marijnh for CodeMirror
- ghostx31 for catppuccin/joplin
Copyright © 2022-present Catppuccin Org
