Aura
Clean, highly visual web design platform aesthetic featuring a light neutral canvas, refined monochrome typography, pill-shaped controls, floating prompt builders, and subtle layered shadows.
Works with
Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit
Color Palette
Accent
Neutrals
Typography
heading-xl
60px · 500 · 60px
The quick brown fox jumps
heading-lg
18px · 500 · 28px
The quick brown fox jumps
body-md
16px · 400 · 24px
The quick brown fox jumps
body-sm
14px · 400 · 20px
The quick brown fox jumps
caption
12px · 400 · 16px
The quick brown fox jumps
micro
10px · 400 · 15px
The quick brown fox jumps
Spacing & Shape
Spacing
| Name | Value | Preview |
|---|---|---|
| xs | 4px | |
| sm | 6px | |
| md | 8px | |
| lg | 12px | |
| xl | 16px | |
| 2xl | 32px | |
| section | 64px | |
| hero-padding | 192px | |
| container-max | 1152px |
Border Radius
| Name | Value | Preview |
|---|---|---|
| pill | 9999px | |
| card | 16px | |
| container | 12px | |
| control | 8px | |
| button-sm | 6px |
FAQ
- What colors does Aura use?
- Aura's core palette includes #ffffff, #fafafa, #f5f5f5, #171717, #000000. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Aura DESIGN.md.
- What font does Aura use?
- Aura'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 Aura design system?
- Clean, highly visual web design platform aesthetic featuring a light neutral canvas, refined monochrome typography, pill-shaped controls, floating prompt builders, and subtle layered shadows.