App Themes

App themes control the chrome of the spreadsheet itself: cell colors, toolbar, formula syntax highlighting, autocomplete, etc. Themes are JSON files matching the ThemeDefinition schema below.

Where themes live

Built-in themes are bundled with the app. Drop a JSON file into ~/.config/likelio/themes/{id}.json to add a custom theme — set system_dark_theme or system_light_theme in config.json to the file's name to activate it.

Schema: ThemeDefinition

name
String
Lookup ID. Set system_dark_theme / system_light_theme to this value to activate.
appearance
"dark" | "light"
Whether the theme is intended for dark mode or light mode.
author
String?
Optional author label, shown in the theme picker.
colors
ThemeColors
Full color schema (see below).
typography
ThemeTypography
Optional font overrides (see below).

Schema: ThemeColors

Every color is a hex string — #rrggbb or #rrggbbaa for alpha.

bg_app
#rrggbb[aa]
Window/app background.
bg_panel
#rrggbb[aa]
Side and bottom panel background.
bg_tab
#rrggbb[aa]
Inactive tab background.
bg_tab_active
#rrggbb[aa]
Active tab background.
border_subtle
#rrggbb[aa]
Hairline borders between panels and rows.
text_primary
#rrggbb[aa]
Default body text.
text_muted
#rrggbb[aa]
Secondary / labels / placeholder text.
accent
#rrggbb[aa]
Brand accent. Used for highlights and the cursor.
toolbar_bg
#rrggbb[aa]
Top toolbar background.
toolbar_text
#rrggbb[aa]
Toolbar foreground.
toolbar_border
#rrggbb[aa]
Toolbar bottom border.
formula_bar_bg
#rrggbb[aa]
Formula bar background.
formula_bar_text
#rrggbb[aa]
Formula bar foreground.
cell_bg
#rrggbb[aa]
Default cell fill.
cell_text
#rrggbb[aa]
Default cell text.
cell_alt_bg
#rrggbb[aa]
Alternating-row fill (when banding is on).
grid_line
#rrggbb[aa]
Spreadsheet grid lines.
header_bg
#rrggbb[aa]
Column-letter / row-number headers.
header_text
#rrggbb[aa]
Header text.
header_border
#rrggbb[aa]
Header bottom/right border.
cursor_bg
#rrggbb[aa]
Active cell highlight.
cursor_border
#rrggbb[aa]
Active cell outline.
selection_bg
#rrggbb[aa]
Multi-cell selection fill (translucent).
formula_keyword
#rrggbb[aa]
Function names in the formula bar (SUM, IF, …).
formula_operator
#rrggbb[aa]
Operators (+ - * / = etc.).
formula_literal
#rrggbb[aa]
Numeric and string literals.
formula_ghost
#rrggbb[aa]
Ghost-text auto-completion suggestion.
formula_refs
[#rrggbb[aa]]
Color cycle for cell references — paired with each range box.
autocomplete_bg
#rrggbb[aa]
Completion popup background.
autocomplete_border
#rrggbb[aa]
Completion popup border.
autocomplete_sel_bg
#rrggbb[aa]
Selected completion row.
autocomplete_text
#rrggbb[aa]
Completion text color.
autocomplete_hint
#rrggbb[aa]
Secondary hint text in completions.
editor_bg
#rrggbb[aa]
JS / SQL code-editor background.
editor_fg
#rrggbb[aa]
Code-editor foreground.
console_request
#rrggbb[aa]
AI panel: outgoing request bubble.
console_response
#rrggbb[aa]
AI panel: response bubble.
console_error
#rrggbb[aa]
AI panel: error message color.

Schema: ThemeTypography

font_size
f32?
Base UI font size in px. Defaults to the app baseline.
font_family
String?
Sans-serif family for UI text.
mono_font_family
String?
Monospace family for cells and the formula bar.

Example

{
  "name": "midnight",
  "appearance": "dark",
  "author": "you",
  "colors": {
    "bg_app": "#0a0a12",
    "bg_panel": "#0d0d18",
    "text_primary": "#ededf0",
    "text_muted": "#8e8ea0",
    "accent": "#f59e0b",
    "cell_bg": "#0a0a12",
    "cell_text": "#ededf0",
    "grid_line": "#1a1a26",
    "selection_bg": "#f59e0b20",
    "formula_keyword": "#60a5fa",
    "formula_refs": ["#f59e0b", "#4ade80", "#60a5fa"]
  },
  "typography": {
    "font_size": 13,
    "font_family": "Inter",
    "mono_font_family": "JetBrains Mono"
  }
}