Token-Security
A confident cybersecurity-SaaS interface built on deep forest-green hero canvases, near-black green ink, and a single high-voltage lime CTA. The system pairs the custom PP Neue Corp display face with DM Sans body type, near-square cards (5px radius), generous white content bands, and a recurring green-on-green palette punctuated by a lime "Let's talk" button and a soft mint-green glow. Brand voltage comes from the dark-green-to-lime contrast and animated cloud/gradient illustration backgrounds.
Works with
Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit
Color Palette
Accent
Neutrals
Typography
display-xl
55px · 500 · 1.2
The quick brown fox jumps
display-lg
45px · 500 · 1.1
The quick brown fox jumps
title
22px · 500 · 1.2
The quick brown fox jumps
title-tight
22px · 500 · 1.2
The quick brown fox jumps
body
18px · 400 · 1.6
The quick brown fox jumps
button
18px · 400 · 1.6
The quick brown fox jumps
Spacing & Shape
Spacing
| Name | Value | Preview |
|---|---|---|
| xxs | 5px | |
| xs | 8px | |
| sm | 10px | |
| md | 14px | |
| lg | 20px | |
| xl | 24px | |
| xxl | 30px | |
| huge | 35px |
Border Radius
| Name | Value | Preview |
|---|---|---|
| xs | 4px | |
| sm | 5px | |
| lg | 20px | |
| pill | 100px | |
| full | 200px |
FAQ
- What colors does Token-Security use?
- Token-Security's core palette includes #1a3027, #222222, #0e1914, #003524, #00352a. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Token-Security DESIGN.md.
- What font does Token-Security use?
- Token-Security's primary typeface is PP Neue Corp. 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 Token-Security design system?
- A confident cybersecurity-SaaS interface built on deep forest-green hero canvases, near-black green ink, and a single high-voltage lime CTA. The system pairs the custom PP Neue Corp display face with…