s0wlz (Matthias Puchstein)
8d6fe00ad8
- Set up project structure and Source of Truth (GEMINI.md). - Implement DNA source files (src/*.yaml) with semantic color definitions. - Build clinical light (Aeon) and high-contrast dark (Neon) specifications. - Create Jinja2-based build system (build.py) using uv for reproducibility. - Implement Neovim theme template mirroring the philosophy.
99 lines
3.4 KiB
Markdown
99 lines
3.4 KiB
Markdown
# Apex Neon — Dark Theme Specification
|
||
|
||
Apex Neon is a high-contrast dark theme built for terminals, editors, and system UI. Color exists to signal **state**, not to decorate space.
|
||
|
||
---
|
||
|
||
## 1. Core Colors (DNA)
|
||
|
||
| Hex | Name | Role |
|
||
|---|---|---|
|
||
| `#050505` | Void Black | Absolute background. The canvas. |
|
||
| `#ff0044` | Razor Red | Primary aggressor. Errors, focus, cursor, active borders. |
|
||
| `#00eaff` | Electric Cyan | Technical accent. Info, links, highlights. |
|
||
| `#ededed` | Stark White | Default readable text. |
|
||
|
||
**Rule:** if a UI element is not important, it does not glow.
|
||
|
||
---
|
||
|
||
## 2. UI Surfaces & Depth
|
||
|
||
| Hex | Name | Usage |
|
||
|---|---|---|
|
||
| `#050505` | Void Deep | Main window backgrounds, terminal background. |
|
||
| `#141414` | Dark Surface | Inputs, inactive tabs, widget backgrounds. |
|
||
| `#262626` | Light Surface | Separators, scroll tracks, inactive borders. |
|
||
| `#737373` | Muted Text | Comments, subtitles, inactive labels. |
|
||
|
||
**Rule:** depth comes from contrast, not brightness.
|
||
|
||
---
|
||
|
||
## 3. Interaction States
|
||
|
||
| Hex | Role | Notes |
|
||
|---|---|---|
|
||
| `#ff0044` | Cursor | Caret in terminals and inputs (Beam shape). |
|
||
| `#ff0044` | Selection BG | “Target locked” selection state. |
|
||
| `#050505` | Selection FG | **Hard rule:** text turns black on red. |
|
||
| `#ff0044` | Active Border | Focused window/element edge. |
|
||
|
||
---
|
||
|
||
## 4. Functional Semantics
|
||
|
||
| Meaning | Hex |
|
||
|---|---|
|
||
| Success / OK | `#00ff99` |
|
||
| Warning / Load | `#ffb700` |
|
||
| Error / Critical | `#ff0044` |
|
||
| Special / Root | `#9d00ff` |
|
||
| Info / Link | `#00eaff` |
|
||
|
||
---
|
||
|
||
## 5. Terminal ANSI Table (16-Color Engine)
|
||
|
||
Bright colors represent **escalation**, not decoration.
|
||
|
||
### Normal Bank (0–7)
|
||
|
||
| Slot | Name | Hex | Meaning |
|
||
|---|---|---|---|
|
||
| color0 | Black | `#050505` | Background |
|
||
| color1 | Red | `#ff0044` | **The Predator** (Cursor/Path/Self) |
|
||
| color2 | Green | `#00ff99` | Success |
|
||
| color3 | Yellow | `#ffb700` | Warning |
|
||
| color4 | Blue | `#00eaff` | Info / links |
|
||
| color5 | Magenta | `#9d00ff` | Special / root |
|
||
| color6 | Cyan | `#00eaff` | Info (mapped) |
|
||
| color7 | White | `#ededed` | Default text |
|
||
|
||
### Bright Bank (8–15)
|
||
|
||
| Slot | Name | Hex | Meaning |
|
||
|---|---|---|---|
|
||
| color8 | BrBlack | `#262626` | UI borders / separators |
|
||
| color9 | BrRed | `#ff8899` | **Alerts** (Distinguishable from Cursor) |
|
||
| color10 | BrGreen | `#2bffb2` | Active success / completion |
|
||
| color11 | BrYellow | `#ffd24d` | Urgent warning |
|
||
| color12 | BrBlue | `#5af3ff` | Active info / focus highlight |
|
||
| color13 | BrMagenta | `#c84dff` | Elevated special state |
|
||
| color14 | BrCyan | `#5af3ff` | Active tech signal |
|
||
| color15 | BrWhite | `#ffffff` | Extreme highlight only |
|
||
|
||
---
|
||
|
||
## 6. Usage Guidelines
|
||
|
||
- **Red is the Agent**. It marks where the user *is* (Prompt/Path) and what the user *controls* (Cursor/Selection).
|
||
- **Distinguish the Threat.** Since the Prompt is now Red, actual Errors must use **Bright Red** (`#ff8899`) or explicit symbols to distinguish them from the environment.
|
||
- **Cyan is informational.** Never use it for errors or destructive actions.
|
||
- **Purple is sacred.** Only for special modes, root, or exceptional states.
|
||
- **Bright = escalation.** If nothing changed, don’t use a bright variant.
|
||
- **Backgrounds stay dark.** Text and state carry the signal.
|
||
- **No random accents.** If a color has no semantic reason, it’s wrong.
|
||
|
||
Apex Neon is not a palette. It’s a rule system with teeth.
|