Umbre
A quiet theme for VS Code and Cursor.
Dark and light themes with simple built-in customization.
Umbre is one calm theme you can shape from the Command Palette.
No copied JSON. No color overrides. Pick a preset, tune what you want, and Umbre writes its own generated theme files for you.
Umbre commands appear in the Command Palette after you choose the Umbre theme.
Start here
- Install Umbre from the Visual Studio Marketplace or Open VSX.
- Run Preferences: Color Theme.
- Choose Umbre.
- Choose a preset or configure the theme yourself from the setup picker.
Recommended settings
Three polished starting points are built in:
- Light — soft, bright, and easy for daytime work.
- Balanced — the default Umbre feel.
- Pure black — true black for very dark rooms and OLED displays.
Choosing a preset gives you a stable fixed setup. Turn on System appearance sync separately when you want Umbre to follow your OS.
What you can tune
Run Umbre: Configure Theme and choose exactly what you want:
- Configure all — walk through every option.
- Recommended presets — pick Light, Balanced, or Pure black.
- Mode — switch between dark and light.
- Surface shade — choose a softer or deeper editor background.
- Accent color — change the command, cursor, focus, badge, and active color.
- Syntax color scheme — choose from Ember, Flare, or Frost syntax palettes.
- Editor dimming — make syntax vivid, balanced, soft, muted, or faint.
- Panel contrast — blend or separate sidebars, panels, tabs, and widgets.
- Terminal contrast — tune the terminal background separately.
- Border intensity — hide separators or make the workspace structure clearer.
- System appearance sync — follow macOS or Windows light/dark appearance.
- Recommended font — preview and choose JetBrains Mono, Fira Code, or Hack Nerd Font.
Changes preview while you choose. Applying a theme keeps your editor settings clean, except when you explicitly apply a recommended font.
Commands
- Umbre: Configure Theme — configure presets, mode, shade, accent, syntax, panels, terminal, borders, sync, and fonts.
- Umbre: Toggle Opposite Mode — jump to the matching light/dark opposite of your current setup.
- Umbre: Choose Font — preview and choose a recommended coding font.
Markdown
Markdown previews and the Markdown editor share Umbre's colors. A few renderer differences remain; see docs/markdown.md.
- Your colors — links use your accent, code uses your syntax scheme.
- Easy reading — clear headings, calm text, and tables with visible lines.
- Mermaid — diagram code is highlighted too.
- Folder trees —
├── listings get quiet guides, colored folders, and muted comments in the preview.
- Clean diffs — rendered Markdown diffs highlight what changed, even inside code and folder trees.
Nice pairing
These extensions work well with Umbre. All are optional.
After setup, Umbre offers to install any you don't have, or to enable any you've turned off.
| |
