Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Routable
FintechRoutable presents a sophisticated nocturnal aesthetic with dramatic dark gradients that evoke premium enterprise software. The typography pairing of TiemposHeadline serif for display and Inter for UI creates an unexpected elegance that positions automation as craft rather than commodity.
Design Identity
Signature Color
Routable Indigo
#6366F1
enterprise-grade automation with human sophistication
Visual Identity
Cinematic dark gradients with oversized serif headlines create a movie-poster intensity that makes B2B automation feel aspirational rather than utilitarian.
Component Style
Minimal rounded buttons with subtle borders and no heavy shadows - everything feels weightless and precise, like floating interface elements against the cosmic background.
Spacing Philosophy
Asymmetrical layout with generous left-side whitespace for the hero content while customer logos create structured rhythm on the right - balancing dramatic emptiness with organized proof points.
Design Principles
- Serif headlines never go below 48px - drama through scale
- Sans-serif UI text stays at 15-18px for consistency
- Buttons use 500 weight Inter at 15px exactly
- Dark gradients always flow from deep navy to purple
- Customer logos maintain equal visual weight through consistent sizing
Target Audience
CFOs and finance operations leaders at mid-market companies who see automation as strategic advantage rather than cost-cutting
Mood
Design descriptions are AI-generated based on visual analysis and may not fully reflect the brand's official design guidelines.
Design System
Typography Scale
| Element | Font | Size | Weight | Line Height |
|---|---|---|---|---|
| body | 16px | 300 | 16px | |
| h1 | 96px | 300 | 96px | |
| h2 | 18px | 500 | 27px | |
| h3 | 48px | 300 | 52.8px | |
| p | 18px | 400 | 27px | |
| a | 16px | 300 | 16px | |
| button | 15px | 500 | 16.5px | |
| nav | 16px | 300 | 16px | |
| header | 16px | 300 | 16px | |
| footer | 16px | 300 | 16px |
Color Palette
#007aff#3b82f6#ffffff
