Brand
Glue's visual identity is intentionally quiet. The product is a terminal agent — the marks and the website get out of its way.
Name
Written Glue. Never all-caps, never stylized. The CLI binary is glue.
Mark
Wordmark
Color
Yellow is an accent, not decoration. Use it for focus states, the shipping status pill, and the mark itself. Everything else is neutral.
| Role | Hex |
|---|---|
| Accent | #FACC15 |
| Accent soft | rgba(250, 204, 21, 0.12) |
| Surface (dark) | #0A0A0B |
| Surface (light) | #FFFFFF |
| Text primary (dark) | #E6E6E6 |
| Text primary (light) | #111111 |
| Divider | #222326 |
| Success | #22C55E |
| Warning | #EAB308 |
| Error | #EF4444 |
| Info | #3B82F6 |
Typography
- Inter — body text (400 / 500 / 600).
- JetBrains Mono — code, terminal blocks, monospace labels.
Do not use uppercase styling on headings. Do not stretch letter-spacing. The default theme metrics are the canonical ones.
Terminal design tokens
The TUI ships two theme modes: minimal (the default; quiet, low-contrast) and highContrast (for environments where default ANSI contrast is insufficient). Both modes share the same token surface; only the ANSI chain differs.
Tokens are ANSI styling chains — read them as calls on a
styledbuilder. For example,bold.yellowmeans the text is rendered bold and foreground-yellow.
Brand dot
The brand dot is ● (U+25CF). It prefixes section headings, selected list items, and prompt rows.
Token styling
| Token | Minimal | High contrast | Description |
|---|---|---|---|
textPrimary | unstyled | brightWhite | Main transcript text. |
textSecondary | gray | white | Supporting text (timestamps, inline meta). |
textMuted | dim | gray | De-emphasised, dim, or placeholder copy. |
accent | bold.yellow | bold.yellow | Brand accent — prompts, highlights, active chip. |
accentSubtle | fg256(229) | brightYellow | Quieter accent — borders, focused backgrounds. |
surfaceBorder | gray | brightWhite | Panel and divider lines. |
surfaceMuted | bg256(236).white | bg256(236).white | Subtle panel fill. |
focus | underline | inverse | Focus indicator. |
selection | bg256(236).yellow | bgYellow.black | Selected text / row. |
info | cyan | brightCyan | Informational messages. |
success | green | brightGreen | Successful tool calls, passing tests. |
warning | yellow | brightYellow | Non-fatal warnings. |
danger | red | brightRed | Errors and destructive prompts. |
Tones
GlueTone maps each semantic role to one of the tokens above, so components pick a tone without hardcoding a style.
| Tone | Backing token | Description |
|---|---|---|
accent | accent | Brand accent. |
info | info | Informational. |
success | success | Success, complete, OK. |
warning | warning | Non-fatal warning. |
danger | danger | Error, destructive. |
muted | textMuted | De-emphasised. |
Voice
- Say what Glue does; show commands and config; avoid marketing hype.
- Prefer examples over claims.
- Admit what is local, what is Docker, what is future work.
Banned words: autonomous developer, 10x, magic, revolutionary.
