UI: themes, with a few built in #10

Open
opened 2026-10-05 09:52:17 +00:00 by twisla · 0 comments
Owner

Idea

Choose a colour theme in Settings, from a handful of built-in ones. The whole firmware follows it: the status bar, lists, dialogs, Toasts, and each App's own colours. The choice is saved and applied at boot.

Why

Taste, readability and fun. A light theme reads better in sunlight, high contrast helps eyes and bright places, and a green or amber phosphor theme suits an IRC and SSH pocket terminal.

What's known

  • Today.

    • src/ui/theme.h holds constexpr colours: background, text, muted, accent, selection, status bar, warning and message. They're used about 110 times across the Apps.
    • Turning them into a runtime Theme struct is mechanical, and costs nothing: no extra RAM per frame, and the frame is redrawn anyway.
  • Hard-coded colours have to become theme colours, starting with the GNSS App:

    • the Sky view's grid circles (0x4208);
    • the per-constellation satellite colours (gnss_app.cpp:23-26).

    The constellation colours may stay fixed by design (GPS is always the same colour), but they must stay readable on every background.

  • RGB332. The canvas is 8-bit RGB332, so every theme's colours have to be chosen after converting to RGB332. Colours that differ in RGB565 can collapse into the same one: selection versus accent, muted versus status bar. A host test can check that each theme's pairs stay distinct and readable (a contrast ratio after conversion).

  • Gemtext and IRC colours (headings, links, quotes, nicks, mentions) should be named roles in the theme, not raw colours, so each theme can tune them.

  • Light themes need care. Several screens were designed for black: the Sky view, the Wi-Fi Tools charts, and any icons from #9. All have to be checked on a light background.

  • The display is an LCD with a backlight, so a dark theme doesn't save battery the way it would on an OLED.

Built-in themes to start with (open for discussion)

  1. Default: today's black with teal-blue.
  2. Light: dark text on off-white.
  3. High contrast: pure black and white, plus one strong accent.
  4. Phosphor green, and maybe amber: monochrome terminal style.
  5. A popular palette (Solarized, Nord or Gruvbox dark), if it survives RGB332.

Questions for the design round

  1. Which themes, and how many?
  2. Colours only, or also fonts (size or family) and spacing? Fonts change layout everywhere, so probably colours only at first.
  3. Should user themes be loadable from the SD card, as a small text file of role = colour lines, or only the built-in ones?
  4. Should there be a live preview in Settings while picking?
  5. Should the constellation and other "meaning" colours be fixed across themes, or themed too?
  6. Should the theme switch automatically, for example light by day and dark by night, using the Clock?

Related

src/ui/theme.h, src/ui/screen.cpp (RGB332 canvas), src/apps/gnss_app.cpp, #9 (Launcher tiles and icons), docs/milestones/M1.md (Q46).

## Idea Choose a colour theme in Settings, from a handful of built-in ones. The whole firmware follows it: the status bar, lists, dialogs, Toasts, and each App's own colours. The choice is saved and applied at boot. ## Why Taste, readability and fun. A light theme reads better in sunlight, high contrast helps eyes and bright places, and a green or amber phosphor theme suits an IRC and SSH pocket terminal. ## What's known - **Today.** - `src/ui/theme.h` holds `constexpr` colours: background, text, muted, accent, selection, status bar, warning and message. They're used about 110 times across the Apps. - Turning them into a runtime `Theme` struct is mechanical, and costs nothing: no extra RAM per frame, and the frame is redrawn anyway. - **Hard-coded colours** have to become theme colours, starting with the GNSS App: - the Sky view's grid circles (`0x4208`); - the per-constellation satellite colours (`gnss_app.cpp:23-26`). The constellation colours may stay fixed by design (GPS is always the same colour), but they must stay readable on every background. - **RGB332.** The canvas is 8-bit RGB332, so every theme's colours have to be chosen after converting to RGB332. Colours that differ in RGB565 can collapse into the same one: selection versus accent, muted versus status bar. A host test can check that each theme's pairs stay distinct and readable (a contrast ratio after conversion). - **Gemtext and IRC colours** (headings, links, quotes, nicks, mentions) should be named roles in the theme, not raw colours, so each theme can tune them. - **Light themes need care.** Several screens were designed for black: the Sky view, the Wi-Fi Tools charts, and any icons from #9. All have to be checked on a light background. - **The display** is an LCD with a backlight, so a dark theme doesn't save battery the way it would on an OLED. ## Built-in themes to start with (open for discussion) 1. **Default**: today's black with teal-blue. 2. **Light**: dark text on off-white. 3. **High contrast**: pure black and white, plus one strong accent. 4. **Phosphor green**, and maybe **amber**: monochrome terminal style. 5. **A popular palette** (Solarized, Nord or Gruvbox dark), if it survives RGB332. ## Questions for the design round 1. Which themes, and how many? 2. Colours only, or also fonts (size or family) and spacing? Fonts change layout everywhere, so probably colours only at first. 3. Should user themes be loadable from the SD card, as a small text file of role = colour lines, or only the built-in ones? 4. Should there be a live preview in Settings while picking? 5. Should the constellation and other "meaning" colours be fixed across themes, or themed too? 6. Should the theme switch automatically, for example light by day and dark by night, using the Clock? ## Related `src/ui/theme.h`, `src/ui/screen.cpp` (RGB332 canvas), `src/apps/gnss_app.cpp`, #9 (Launcher tiles and icons), `docs/milestones/M1.md` (Q46).
twisla added the
kind
feature
area/ui
status
needs-design
priority
low
labels 2026-10-05 09:52:17 +00:00
twisla added this to the U1 Look and feel milestone 2026-10-05 20:14:08 +00:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: twisla/roro9stack#10