CaYatur · Oct 17, 2026 · Oct 17, 2026 · Oct 17, 2026 · Oct 17, 2026 · Oct 17, 2026
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,46 @@ GitHub. The full reasoning and the measurements behind each change are in [ROADM
 
 ## Unreleased
 
+### Control panel
+
+- **Interface themes [770].** Settings → Application → Interface Theme offers seven themes and
+  Device default:
+  - CaYaDev, the existing look and still the default;
+  - Dark, a neutral graphite;
+  - Light;
+  - High Contrast, black with yellow, held to WCAG AAA (7:1 for text);
+  - Midnight, Sepia and Neon.
+
+  Device default follows the operating system's light or dark preference and switches live.
+  The theme changes the panel only. The visualizer output, the stream overlay and your own
+  colours stay as they are. It is saved in the settings file, so a backup carries it, and
+  "Reset to Defaults" keeps it.
+- **Every panel colour comes from one table.** `src/shared/ui-themes.js` defines 64 colour tokens
+  per theme. `admin.css` and `studio.css` no longer contain a colour outside the CaYaDev `:root`
+  block. The timeline and projection-mapping canvases read the same tokens and redraw when the
+  theme changes. The window opens in the theme's background, so a light theme does not flash
+  dark first.
+- **Readability is tested, not assumed.**
+  - Every theme is checked against 128 contrast rules: 4.5:1 for text on every surface, button
+    text in the middle of the gradient, the code editors, focus rings and switch knobs at 3:1.
+  - Every rule in the panel's CSS that sets both a text colour and a background is measured in
+    every theme.
+  - A guard fails when a colour is written into the panel CSS or a panel script outside the
+    table, so a new panel cannot break a theme quietly.
+  - The self-test selects every theme from the picker, walks every category, and measures the
+    colour Chromium actually draws for each visible text against its background: about 2,600
+    texts per theme, none below the threshold.
+- **Three CaYaDev colours moved so the default theme passes the same test.**
+  - The small hint text was 3.4–4.4:1 on cards and is now at least 4.5:1.
+  - Code comments in the shader editor were 3.3:1.
+  - White text on the solid red danger button was 3.9:1.
+  - The end of the red gradient on filled buttons is slightly deeper, so white text reads in the
+    middle of the gradient too.
+- **Two labels were unreadable in every theme.** The empty side of the A/B crossfader and the
+  "built-in" tag in Studio's list were dimmed with opacity to 2.9:1 and 3.7:1. They now use the
+  secondary text colour. The decorative "·" separators in status lines are hidden from screen
+  readers.
+
 ### Video export
 
 - **Eleven formats instead of one MP4 [521].** H.264 and H.265 in MP4, ProRes 422 HQ and DNxHR HQ

diff --git a/README.md b/README.md
@@ -17,7 +17,7 @@ layers and **40 GPU effects**, an **OBS overlay**, **Spout / Syphon**, **project
 [![Downloads](https://img.shields.io/github/downloads/CaYatur/SoundVisualizer/total?label=downloads)](https://github.com/CaYatur/SoundVisualizer/releases)
 [![License: MIT](https://img.shields.io/badge/License-MIT-e11d2a.svg)](LICENSE)
 [![Platform](https://img.shields.io/badge/platform-Windows%20%7C%20macOS%20%7C%20Linux-111997.svg)](#download)
-[![Tests](https://img.shields.io/badge/tests-3189%20passing-2ea043.svg)](#tests)
+[![Tests](https://img.shields.io/badge/tests-3222%20passing-2ea043.svg)](#tests)
 [![Electron](https://img.shields.io/badge/Electron-43-47848F.svg)](https://www.electronjs.org/)
 
 <a href="https://github.com/CaYatur/SoundVisualizer/releases/latest"><img src="https://img.shields.io/badge/Download-Windows-0a84ff?style=for-the-badge" alt="Download for Windows" /></a>
@@ -1154,6 +1154,9 @@ return the capture diagnosis and the live analysis (key, chord, pitch, loudness,
   slider limits 5×.
 - **Turkish and English**, switchable at runtime; the self-test fails if any interface string is
   left untranslated.
+- <kbd>3.1.6</kbd> **Interface themes**: CaYaDev, Dark, Light, High Contrast, Midnight, Sepia and
+  Neon, or Device default to follow your system's light or dark setting. Every theme is
+  contrast-tested: the self-test measures every text it draws.
 
 ---
 
@@ -1741,7 +1744,7 @@ npm test
 npm start -- --smoke
 ```
 
-**3189 unit tests, all passing.** They are written to check answers, not to exercise lines:
+**3222 unit tests, all passing.** They are written to check answers, not to exercise lines:
 
 - **Formulas** are checked against values derived by hand from their definitions — Viviani's curve
   staying on its sphere, the torus tube radius, Chladni's m↔n antisymmetry, every attractor staying

diff --git a/README.tr.md b/README.tr.md
@@ -18,7 +18,7 @@ destesi**, ve **MCP üzerinden yapay zekâ kontrolü**.
 [![İndirme](https://img.shields.io/github/downloads/CaYatur/SoundVisualizer/total?label=indirme)](https://github.com/CaYatur/SoundVisualizer/releases)
 [![Lisans: MIT](https://img.shields.io/badge/Lisans-MIT-e11d2a.svg)](LICENSE)
 [![Platform](https://img.shields.io/badge/platform-Windows%20%7C%20macOS%20%7C%20Linux-111997.svg)](#hızlı-başlangıç)
-[![Test](https://img.shields.io/badge/test-3189%20geçiyor-2ea043.svg)](#testler)
+[![Test](https://img.shields.io/badge/test-3222%20geçiyor-2ea043.svg)](#testler)
 [![Electron](https://img.shields.io/badge/Electron-43-47848F.svg)](https://www.electronjs.org/)
 
 <a href="https://github.com/CaYatur/SoundVisualizer/releases/latest"><img src="https://img.shields.io/badge/%C4%B0ndir-Windows-0a84ff?style=for-the-badge" alt="Windows için indir" /></a>
@@ -1159,6 +1159,9 @@ tanısını ve canlı çözümlemeyi (ton, akor, perde, gürlük, davul bantlar
   aralıklar** sürgü sınırlarını 5 katına çıkarıyor.
 - Çalışırken değiştirilebilen **Türkçe ve İngilizce**; çevrilmemiş tek bir arayüz metni kalırsa öz test
   başarısız oluyor.
+- <kbd>3.1.6</kbd> **Arayüz temaları**: CaYaDev, Karanlık, Aydınlık, Yüksek Karşıtlık, Gece Mavisi, Sepya
+  ve Neon; ya da sistemin açık/koyu ayarını izleyen Cihaz varsayılanı. Her temanın karşıtlığı
+  sınanıyor: öz test çizdiği her yazıyı ölçüyor.
 
 ---
 
@@ -1744,7 +1747,7 @@ npm test
 npm start -- --smoke
 ```
 
-**3189 birim testi, hepsi geçiyor.** Satır çalıştırmak için değil, cevap denetlemek için yazıldılar:
+**3222 birim testi, hepsi geçiyor.** Satır çalıştırmak için değil, cevap denetlemek için yazıldılar:
 
 - **Formüller**, tanımlarından elle türetilmiş değerlerle sınanıyor — Viviani eğrisinin küre üzerinde
   kalması, simidin boru yarıçapı, Chladni'nin m↔n antisimetrisi, her çekicinin sınırlı kalması ve görüş

diff --git a/ROADMAP.md b/ROADMAP.md
@@ -93,6 +93,7 @@ hands, and a row only moves up once it ships.
 |---|:--:|---|
 | Per-app audio capture on macOS and Linux | v3.1.6 | On `main` (#514, #517). Linux verified in WSLg with PulseAudio; macOS written on ScreenCaptureKit and compiled in CI, never run on a Mac. Windows shipped in v3.1.3 |
 | Live level meter per application | v3.1.6 | Done on `main` (#516): a moving dB-scale bar per application, streamed only while the picker is on screen |
+| Interface themes | v3.1.6 | Done on `main` (#770): CaYaDev, Dark, Light, Device default, High Contrast, Midnight, Sepia and Neon; contrast tested in every theme |
 | Comprehensive video export | v3.1.6 | Done on `main`: formats, alpha and frame sequences (#521, #525, #529), about 3× faster export (#531), duration sources, metadata and clean cancel (#523, #524, #528, #532), profiles (#522), chapters (#527), batch queue (#526), the two render modes (#530) |
 | Broadcast layout editor | v3.1.7 | Not started |
 | NDI | v3.1.8 | Deferred for licence reasons, not difficulty — see "Not done, and why" |
@@ -131,7 +132,7 @@ npm test
 npm start -- --smoke
 ```
 
-- **3189 unit tests, all passing** on `main`. 703 of those shipped in v3.1.0;
+- **3222 unit tests, all passing** on `main`. 703 of those shipped in v3.1.0;
   105 came with v3.1.1; 163 came with v3.1.2; 157 came with v3.1.3 — 1128 at
   that tag — 469 more with v3.1.4, most of them from the MilkDrop work — 1597 at
   that tag — 1402 more with v3.1.5 — 2999 at that tag — and 27
@@ -3567,6 +3568,47 @@ Export is about three times faster for MP4 and WebM, with no change to the pictu
     Nothing is worse by more than 1.03 except "fed - DSC-011", which went from black to MilkDrop's coloured fields.
   - **The harness runs in parallel** (`--jobs=N`). MilkDrop instances and engine processes share the list. On 100 presets, MilkDrop's 60 frames took 113 s on 8 jobs, against about 98 s for 13 presets before. Results match the sequential run for every noise-free preset.
 
+### Interface themes (#770) · done
+
+The panel had one look. It now has seven themes and Device default, chosen under Settings → Application → Interface Theme.
+
+- **One table.** `src/shared/ui-themes.js` holds 64 colour tokens per theme: surfaces, text, accent, states, overlays, the clip deck and performance view, the code editors and the media backdrop. Some tokens are channels (`--fg-rgb: 255 255 255`) that the CSS uses with an alpha, as `rgb(var(--fg-rgb) / .05)`. A white hover tint on a dark theme becomes a dark tint on a light theme, and the alpha stays in the CSS.
+- **Nothing else holds a colour.**
+  - About 320 colour literals in `admin.css` and `studio.css` became tokens.
+  - Undefined variables with fallbacks (`--fg`, `--bad`, `--err`) now point at real tokens.
+  - The timeline and projection-mapping canvases read tokens at draw time and redraw on a theme change.
+  - Colours left in panel scripts are user content: palette defaults, clip colours, the recording's own frame. They are listed with a reason.
+- **What stays fixed.**
+  - The media preview backdrop is dark in every theme, because a picture sits on it.
+  - The visualizer output, the stream overlay and user colours are not themed.
+  - `nativeTheme.themeSource` is never set, because it would change `prefers-color-scheme` in the visualizer window too.
+- **No dark flash.**
+  - The main process opens the panel window in the theme's background colour and passes the theme in the page address.
+  - A script in `<head>` applies it before the body paints.
+  - The address is updated on change, so the language switch's reload opens in the same theme.
+- **Device default** resolves to Dark or Light from `prefers-color-scheme` and follows a change live, measured with an emulated scheme flip.
+- **Contrast thresholds** come from WCAG 2.2. Text is 4.5:1, since most panel text is 10.5–13 px. Focus rings, meaningful borders and switch knobs are 3:1. High Contrast is held to 7:1.
+  - `--accent2` is both heading text and the end of the button gradient. It cannot be both: a red that reads at 4.5:1 on a dark card cannot carry white text at 4.5:1. So the gradient end became its own token, `--accent-grad`.
+- **Measured before and after in CaYaDev.**
+  - Panel screenshots of every category in both languages, taken before any CSS change, were compared pixel by pixel.
+  - With the four intentional changes set back to their old values, the remaining differences were live content (BPM, the app list, meters), the new picker, and one consolidated green on the lighting status.
+- **Tests that fail on misuse.**
+  - Every theme defines exactly the token set.
+  - `:root` equals the CaYaDev table.
+  - No colour literal outside `:root`.
+  - Every `var()` is defined, and channel tokens are used only as channels.
+  - Panel scripts carry no colour outside the content list, and the list cannot go stale.
+  - 128 contrast rules per theme.
+  - Every CSS rule with both a text colour and a background is measured in every theme. This caught the "Live" pill in Light and Sepia at 4.17:1.
+  - The head script was tested in a fake DOM.
+- **Self-test.** Every theme is picked from the panel's own picker, every category is scrolled through, and the colour Chromium draws for each visible text is measured against its composited background.
+  - About 2,600 texts per theme, none below the threshold.
+  - The lowest ratio per theme: CaYaDev 4.54, Dark 4.54, Light 4.96, High Contrast 7.8, Midnight 4.54, Sepia 5.12, Neon 4.54.
+  - The first run found the decorative status separators and a dimmed link.
+  - Two measurement traps:
+    - A gradient's `transparent` stop was averaged as black.
+    - In a background window, CSS transitions do not advance, so the old theme's colour was measured. Pending transitions are now finished before measuring.
+
 ## v3.1.7 — Broadcast layout editor
 
 v3.0.0 already ships the broadcast template group: a restrained bar