InvestDesign
The Invest design system.
One component kit for the web app — pure black, white, and zinc, with functional accent colors. Built to carry the same craft as the native iOS app.
Foundations
Color
Background#000000
Card#0a0a0a
Border#1f1f1f
Foreground#ededed
Muted#a1a1a1
Blue (accent)#0070f3
Success#2ed3a0
Warning#f5a623
Danger#ff4d4d
Cyan#50e3c2
Purple#7928ca
Pink#ff0080
Foundations
Typography
Display 5xl
Heading 3xl
Subtitle xl
Body — the quick brown fox jumps over the lazy dog. Calm, legible, high-contrast text on a true-black canvas.
Muted small — secondary and helper copy.
Mono — AAPL · 392.41 · +1.24%
Components
Badges
DefaultSecondaryOutline+1.24%After-hours−0.86%BluePurple
Components
Inputs
Components
Cards
Apple Inc.
AAPL · NASDAQ
$392.41+1.24%
Portfolio
Total value
$1,024,318.07
Components
Tabs
Price, chart, and key stats live here.
Components
Toggles, alerts, avatars
PS
AI
MU
AvatarsHeads up
Markets are closed. Prices shown are at last close.
Order failed
Insufficient virtual cash for this trade.
Components
Data & charts
Sparkline · up
Directional green
Sparkline · down
Directional red
Sparkline · neutral
Portfolio white
Bar chart
Revenue by quarter (relative)
Slider
Position size · 25 shares
025%100
Progress
Determinate bars — neutral, accent, success
Portfolio used72%
52-week range61%
Win rate59%