Theneo
A dark, developer-documentation-first marketing interface built on a near-black canvas (#080808) with white display headlines, soft-gray body copy, and a violet-blue accent reserved for badges and product UI moments. The system reads as modern dev-tooling — pill-shaped CTAs, low-contrast hairline cards that hold real product/code fragments, and the custom Supreme (display) + Plein (text) type pairing. Brand voltage comes from embedded product chrome and code snippets shown inside cards rather than from heavy color.
Works with
Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit
Color Palette
Accent
Neutrals
Typography
h1
48px · 500 · 1.18
The quick brown fox jumps
h2
18px · 500 · 1.3
The quick brown fox jumps
h3
20px · 500 · 1.18
The quick brown fox jumps
h4
14px · 500 · 1.18
The quick brown fox jumps
body
16px · 400 · 1.5
The quick brown fox jumps
button
16px · 400 · 1.5
The quick brown fox jumps
Spacing & Shape
Spacing
| Name | Value | Preview |
|---|---|---|
| xxs | 4px | |
| xs | 8px | |
| sm | 12px | |
| md | 16px | |
| lg | 24px | |
| xl | 36px | |
| xxl | 40px | |
| section | 56px |
Border Radius
| Name | Value | Preview |
|---|---|---|
| xs | 2px | |
| sm | 4px | |
| md | 10px | |
| input | 12px | |
| card | 14px | |
| pill | 48px |
FAQ
- What colors does Theneo use?
- Theneo's core palette includes #ffffff, #cdcdcd, #b4b4b4, #9c9c9c, #828282. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Theneo DESIGN.md.
- What font does Theneo use?
- Theneo's primary typeface is Supreme. The complete type scale (sizes, weights, line-height and letter-spacing per role), with an open substitute where the original is licensed, is documented in the DESIGN.md.
- What is the Theneo design system?
- A dark, developer-documentation-first marketing interface built on a near-black canvas (#080808) with white display headlines, soft-gray body copy, and a violet-blue accent reserved for badges and pr…