Overview
NIMBUS is an industry design system for personal finance planning apps: budget dashboards, investing overviews, forecast views, plan pricing, onboarding prompts and product update decks. It sets whisper-weight Fraunces 300 headlines over a Nightfall / Night Card / Moon Graphite ground, with Golos Text for interface copy and Spline Sans Mono for labels and figures. Colour stays out of the chrome: Violet Hour, Orchid Dusk, High Altitude and Night Indigo appear only as full-bleed category tiles, and Forecast Cyan only as chart lines. The single primary action is a Cloud White pill, controls use 8px corners, cards 16px and category tiles 30px, with no shadows. The imagery language has Sky, Material and Detail roles: desaturated cloud photography, frosted violet glass and a tilted phone with an abstract chart. All plans, prices and figures are fictional placeholders, not financial advice. Included: foundations (color, type, spacing, imagery, patterns), components (buttons & tags, cards, dialog, forms, navigation, feedback, table), theme sheet, Cirrus finance planner landing starter, 16:9 product update deck, sample web photography in assets/imagery/, and README, AGENTS.md and CLAUDE.md guides.
Highlights
- Personal finance planning industry system (budgets, investing, forecasts)
- Nightfall / Night Card / Cloud White + Fraunces 300 display, Golos Text UI, Spline Sans Mono labels
- Colour only as full-bleed category tiles (Violet Hour, Orchid Dusk, High Altitude, Night Indigo) and Forecast Cyan chart lines
- One Cloud White pill as the primary action, 8px controls, 16px cards, 30px tiles, no shadows
- Web imagery roles: Sky · Material · Detail (cloud photography, frosted glass, tilted phone)
- Budget form, plan picker dialog, forecast chart, spend table and price capsule
- Cirrus planner landing + 16:9 product update deck, fictional figures throughout
