Acctual
A bright, fintech-friendly invoicing interface built on a near-white blue-tinted canvas (#f7fafc) with near-black pill CTAs and the rounded geometric Open Runde typeface. The system reads as approachable modern fintech — soft generously-rounded white cards, real invoice and payment-method UI shown as hero artifacts, a near-monochrome action layer, and small bursts of saturated accent color (blue, violet, magenta, green) used only inside product chrome and category highlights.
Works with
Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit
Color Palette
Accent
Neutrals
Typography
display
64px · 600 · 1.125
The quick brown fox jumps
heading
32px · 600 · 1.25
The quick brown fox jumps
body
16px · 500 · 1.21
The quick brown fox jumps
Spacing & Shape
Spacing
| Name | Value | Preview |
|---|---|---|
| xxs | 4px | |
| xs | 8px | |
| sm | 10px | |
| base | 12px | |
| md | 16px | |
| lg | 24px | |
| xl | 28px | |
| xxl | 40px |
Border Radius
| Name | Value | Preview |
|---|---|---|
| sm | 10px | |
| md | 12px | |
| lg | 16px | |
| xl | 20px | |
| xxl | 32px | |
| pill | 100px | |
| full | 1250px |
FAQ
- What colors does Acctual use?
- Acctual's core palette includes #000000, #1e1e1e, #666666, #8d8d8d, #999999. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Acctual DESIGN.md.
- What font does Acctual use?
- Acctual's primary typeface is Open Runde. 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 Acctual design system?
- A bright, fintech-friendly invoicing interface built on a near-white blue-tinted canvas (#f7fafc) with near-black pill CTAs and the rounded geometric Open Runde typeface. The system reads as approach…