Lusion
A high-craft 3D-studio portfolio built on a pale lavender-white wash with pure-black ink type and a single electric-blue brand accent. The system reads as minimal, gallery-like, and motion-first — a large dark rounded media stage dominates the viewport, framed by neutral Aeonik type set entirely at weight 400, pill-shaped nav buttons, and a restrained set of saturated 3D-render accent colors (electric blue, cyan, lime) that come from the rendered artwork rather than from UI chrome.
Works with
Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit
Color Palette
Accent
Neutrals
Typography
display
144px · 400 · 1.0
The quick brown fox jumps
heading-lg
38px · 400 · 1.15
The quick brown fox jumps
heading-md
36px · 400 · 1.1
The quick brown fox jumps
heading-sm
21.6px · 400 · 1.4
The quick brown fox jumps
button
14px · 400 · 1.15
The quick brown fox jumps
Spacing & Shape
Spacing
| Name | Value | Preview |
|---|---|---|
| xxs | 5px | |
| xs | 9px | |
| sm | 14px | |
| md | 16px | |
| lg | 19px | |
| xl | 23px | |
| xxl | 26px | |
| huge | 29px |
Border Radius
| Name | Value | Preview |
|---|---|---|
| none | 0px | |
| xs | 3px | |
| sm | 10px | |
| md | 15px | |
| lg | 16px | |
| xl | 18px | |
| pill-sm | 76px | |
| pill-md | 88px | |
| pill | 100px |
FAQ
- What colors does Lusion use?
- Lusion's core palette includes #000000, #111111, #2b2e3a, #ffffff, #f0f1fa. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Lusion DESIGN.md.
- What font does Lusion use?
- Lusion's primary typeface is Aeonik. 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 Lusion design system?
- A high-craft 3D-studio portfolio built on a pale lavender-white wash with pure-black ink type and a single electric-blue brand accent. The system reads as minimal, gallery-like, and motion-first — a…