Northflank
A deep-space dark developer-platform interface built on a near-black blue-tinted canvas (#03060e) with a single bright-green primary accent (#2dd881) and a distinctive monospace body voice (JetBrains Mono). The system reads as a serious, engineering-first deployment product — real product UI panels (deployment dashboards, log streams, pipeline diagrams) shown directly inside bordered cards, monospace eyebrow labels, hairline borders, and a multi-hued cyan/blue/green glow used sparingly for depth. Brand voltage comes from the green CTA, the mono type, and the live product chrome rather than from decorative color.
Works with
Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit
Color Palette
Accent
Neutrals
Typography
display
56px · 600 · 1.2
The quick brown fox jumps
heading
24px · 600 · 1.2
The quick brown fox jumps
eyebrow
14px · 400 · 1.41
The quick brown fox jumps
body-mono
17px · 500 · 1.41
The quick brown fox jumps
button
14px · 400 · 1.41
The quick brown fox jumps
Spacing & Shape
Spacing
| Name | Value | Preview |
|---|---|---|
| xxs | 4px | |
| xs | 8px | |
| sm | 12px | |
| md | 16px | |
| lg | 20px | |
| xl | 24px | |
| xxl | 32px | |
| xxxl | 48px | |
| section | 64px | |
| section-lg | 80px |
Border Radius
| Name | Value | Preview |
|---|---|---|
| xs | 2px | |
| sm | 4px | |
| md | 6px | |
| lg | 8px | |
| pill | 50px | |
| full | 9999px |
FAQ
- What colors does Northflank use?
- Northflank's core palette includes #2dd881, #01c987, #00c896, #01b2e1, #425aa3. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Northflank DESIGN.md.
- What font does Northflank use?
- Northflank's primary typeface is Inter. 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 Northflank design system?
- A deep-space dark developer-platform interface built on a near-black blue-tinted canvas (#03060e) with a single bright-green primary accent (#2dd881) and a distinctive monospace body voice (JetBrains…