Monofile ships 24 built-in themes in 15 families. You pick a family and a mode (light, dark or system). The choice applies to the sidebar, dialogs, the markdown editor, the code editor, syntax highlighting in fenced code blocks, drawings, and mermaid diagrams.

## Family plus mode, not one long list

The family is the look and the mode is the brightness, and you set them independently. Set the mode to System and the workspace follows the operating system, switching between the light and dark variant of the same family.

Nine families carry both variants:

| Family | Light variant | Dark variant |
|---|---|---|
| Default | Light | Dark |
| GitHub | GitHub Light | GitHub Dark |
| Solarized | Solarized Light | Solarized Dark |
| Catppuccin | Catppuccin Latte | Catppuccin Mocha |
| Gruvbox | Gruvbox Light | Gruvbox Dark |
| One | One Light | One Dark |
| Rosé Pine | Rosé Pine Dawn | Rosé Pine |
| Tokyo Night | Tokyo Night Day | Tokyo Night |
| Everforest | Everforest Light | Everforest Dark |

Six more have a single variant and appear under Specialty. While one of these is selected, the mode toggle has no effect.

| Family | Variant |
|---|---|
| Sepia | Light only |
| Nord | Dark only |
| Dracula | Dark only |
| Monokai | Dark only |
| Ayu Mirage | Dark only |
| High Contrast | Dark only, tuned for contrast |

## Switching

| Where | How |
|---|---|
| Settings | Click the gear icon in the header, or press <kbd>Ctrl</kbd> + <kbd>,</kbd> (<kbd>⌘</kbd> + <kbd>,</kbd> on macOS). Mode is at the top, then the family grid |
| Command palette | Press <kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>P</kbd> (<kbd>⌘</kbd> + <kbd>Shift</kbd> + <kbd>P</kbd> on macOS) and run **Switch theme…**, then pick from the list |
| Settings page | Go to `/settings` and use the Appearance section |

Each family card previews its own colours.

## What a theme actually covers

A theme defines a full palette applied to the document root, so one choice reaches everything:

- The app shell: background, sidebar, panels, buttons, dialogs
- The markdown editor: text, headings, links, tables, quotes
- Code: syntax highlighting in the code editor and in every fenced code block
- Diagrams: mermaid picks up light or dark to match, and drawings open in the matching canvas mode

Text size, font and column width are a separate set of editor preferences, so you can widen your writing column without changing the palette.

## Importing a VS Code or base16 theme

Open Settings, expand **Import / Export**, and click **Import**. The file picker takes a `.json` file, and Monofile detects whether it is a Monofile theme, a VS Code colour theme, or a base16 scheme.

| Format | What it needs | What is read |
|---|---|---|
| VS Code colour theme | `editor.background` plus a foreground colour | Workbench colours for the app, and the token colours for syntax highlighting |
| base16 scheme | `base00` and `base05` | The sixteen base colours, mapped the standard way |
| Monofile theme | An exported Monofile theme file | Everything, as is |

Monofile fills in any colour the source does not define, deriving it from the source's background and foreground, so a theme that says nothing about popovers still gets readable popovers. Light or dark comes from the theme's own declaration, or from the brightness of its background.

> [!NOTE]
> Font styles are dropped, so italic comments in the original come through as plain colour. An imported theme becomes its own single-variant family, so the mode toggle has no effect while it is selected.

If the file is not usable, the error names the reason. The two most common are "Not a usable VS Code theme: missing editor.background/foreground" and "Not a base16 scheme: missing base00/base05".

## Custom themes are per-browser

Imported themes are stored in your browser, not in your account. They appear in a Custom section in Settings and work like the built-ins. Sign in on another machine and they are absent, and clearing site data removes them.

**Export** writes the selected theme to a JSON file that you can import on another machine, keep in a repository, or hand to someone else.

## Next steps

:::cards
- [[The Markdown Editor]] — Live WYSIWYG editing, slash commands, and how saving works.
- [[Markdown Reference]] — Every markdown feature Monofile renders, with examples.
- [[Diagrams]] — Mermaid in markdown, and turning mermaid into an editable drawing.
- [[Keyboard Shortcuts]] — Every shortcut in the app, by area.
:::
