Custom theme

Mimic supports three theme modes:

• Dark - default dark mode
• Light - light mode
• Custom - CSS variable overrides edited visually or imported as JSON

Visual editor

Select Custom in Settings → Appearance → Theme to open the custom theme editor panel. The panel organizes CSS variables into logical groups:

Group	Variables
Background	--bg, --bg-secondary, --bg-tertiary
Surface	--surface, --surface-hover
Borders	--border, --border-active
Text	--text-primary, --text-secondary, --text-muted
Accent	--accent, --accent-dim
Status	--danger, --success, --warning

Each variable has a color swatch and hex text input. Changes apply immediately. Use Reset per section or Reset All to restore dark defaults.

Import / Export

Use Import JSON to load a theme file or Export to save your current custom theme. See below for the JSON format.

Custom theme JSON format

{
  "--bg": "#0f0c08",
  "--bg-secondary": "#1a1510",
  "--bg-tertiary": "#241e17",
  "--surface": "#1a1510",
  "--text-primary": "#e8e0d4",
  "--text-secondary": "#a09884",
  "--text-muted": "#605848",
  "--accent": "#ffb347",
  "--danger": "#ff6b4a",
  "--warning": "#f0c040",
  "--success": "#6bc46b",
  "--border": "#2a241c",
  "--border-active": "#3a342c"
}

All values must be valid CSS colors or values. Keys must start with --.

Reference

See docs/examples/custom.css for all available variables.

Behavior

Custom themes layer on top of the dark base theme. Undefined variables fall through to dark theme defaults.