Themes & Typography

Codemux's look is two independent settings: a theme (every color in the app, the terminal, and syntax highlighting) and typography (which fonts and sizes each surface uses). Both live under Settings → Appearance, and both sync with your account.

Picking a Theme

Themes are chosen from the command palette, not from a grid in Settings.

Press Ctrl+K and type. Themes are search-only — the resting palette doesn't list them. The Themes group answers to a theme's own name or to any of the words theme, colors, palette, and appearance. The theme you're on is marked current.

• Arrow up and down to preview. Highlighting a row repaints the whole app live, so you judge a theme against your actual work rather than a swatch strip.
• Enter keeps it. Escape puts back the theme you started on.
• The footer spells this out while you browse: ↑↓ preview · ↵ keep it · esc back to <theme>, plus a reminder that the choice syncs to your account.

Themes are hidden in command mode (>) and path queries (/), so they never crowd out those results.

Settings → Appearance → Theme carries a Change button that opens the palette already seeded with the query, and a Customize button that opens the studio.

Built-in themes

Graphite (the default), Warm Stone, Ember, Abyss, and Iris.

Your saved custom themes list after the built-ins.

Codemux themes are dark-only for now. There is no light mode and no system light/dark following — the theme generator rejects a light background with "Light themes are not enabled yet. Choose a darker background.", and a VS Code import offers only that extension's dark variants.

The Match app theme / System (Omarchy) choice under Settings → Terminal is a separate thing: it decides where the terminal's 16 ANSI colors come from, not whether the app is light or dark.

Theme Studio

Settings → Appearance → Theme → Customize opens the Customize theme modal. The command palette's Themes group also carries two direct entries: Make a theme from two colors… and Paste a VS Code or shadcn theme….

The right half of the modal is a live preview — a miniature shell, diff, and terminal — so you see the theme in context. It never repaints the running app, so cancelling leaves nothing to undo.

Generate — from two colors

Pick a Background and an Accent (hex or oklch(...)), give the theme a Name, and Codemux solves the other 24 roles for you. A Solved roles grid shows all 26 tokens, with a contrast readout underneath:

Body text 8.4:1 · accent on surface 4.1:1

It turns green once body text clears 7:1 and the accent clears 3:1, so you can tell a legible theme from a pretty one before you save it.

Import — from somewhere else

The Import tab takes a theme from three sources:

• VS Code — search the VS Code Marketplace by name. Codemux lists matches with publisher and install counts, fetches the .vsix, and offers its dark variants.
• shadcn / Tailwind — paste a CSS variable block containing --background and --primary.
• A .codemux-theme file — paste it, drag it in, or use Choose file (.json, .jsonc, .txt, .css).

Parsing happens as you type. The result reads "Recognised a shadcn theme · 19 of 26 roles mapped" and then names up to four roles Codemux derived for you, so an incomplete source is an honest state rather than a silent one.

Editing roles by hand

Edit roles by hand at the foot of either tab reveals every token as a color picker plus hex field, in two groups:

• Application roles — 26 tokens: background, foreground, card, popover, primary, secondary, muted, accent, border, input, ring, the seven sidebar* roles, brandAccent, and each one's *Foreground pair.
• ANSI and syntax — the 16 terminal slots: black, red, green, yellow, blue, magenta, cyan, white, and their bright counterparts.

Colors accept 3-, 4-, 6-, and 8-digit hex or oklch(...).

Saving, exporting, deleting

• Save and apply writes the theme and switches to it. The id is derived from the name (max 48 characters).
• Export downloads <theme-id>.codemux-theme.json.
• The trash icon deletes it; if it was the active theme, you fall back to Graphite.

Export and delete appear only once a custom theme has been saved.

A theme applies to the shell, terminal, code, and editor together — there is no per-surface theme.

Typography

Settings → Appearance → Typography sets the fonts. (Settings → Terminal's Font row is just a pointer with an Open Appearance button.)

Only font family and font size are configurable. There is no line-height, weight, letter-spacing, or ligature setting — code line height is derived from the code size, and terminal cell metrics are fixed.

Simple mode

The default. Two cards, two decisions:

• Interface & conversation — one typeface across the app (default DM Sans) and one size. Conversation text follows automatically at two pixels smaller for a calmer reading rhythm; the card badge shows what that works out to.
• Developer font — one monospace face (default JetBrains Mono) and one size, shared by code blocks, diffs, the file editor, and terminal cells.

Advanced mode

Tune each surface independently:

Sizes are dropdowns of whole pixel values, not sliders. An empty family choice inherits the closest matching font rather than falling back to a system default, so Conversation tracks Interface and Terminal tracks Code until you say otherwise. Switching back to Simple doesn't discard your per-surface overrides.

Which fonts you can pick

The picker lists the fonts actually installed on the device. Where the browser engine exposes local font access it enumerates everything; on WebKit it probes a curated catalog instead (Berkeley Mono, Cascadia Code, Fira Code, Geist, Hack, IBM Plex, Inconsolata, Iosevka, JetBrains Mono, Menlo, SF Mono, Source Code Pro, Ubuntu Mono, and similar), plus the bundled DM Sans and JetBrains Mono and the CSS generics.

You can also type any family name and choose Use "<name>". The Code and Terminal pickers filter to monospace faces only.

Restore defaults appears once anything is customized.

Changes apply immediately everywhere, including to live terminal panes — no restart, no pane remount.

What Syncs

Font names sync, not font files. If a face isn't installed on another device, Codemux falls back safely there without changing the saved choice, so it comes back the moment you're on a machine that has it.

Sync requires being signed in. Offline or signed-out changes are cached locally and flushed on the next sign-in.

Related

• Settings — the full settings reference
• Command Palette — where themes are picked
• Terminal — cursor style, ANSI color sourcing, renderer