Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Raycast embodies a dark, technical sophistication with an almost obsidian-deep background that creates dramatic contrast with vibrant red-to-cyan gradient accents. The typography feels developer-focused yet approachable, with generous whitespace that lets the dynamic gradient geometries breathe and command attention.

Signature Color
Raycast Crimson
#ff4757
urgent productivity energy that cuts through the darkness - commanding attention while maintaining technical credibility
The distinctive diagonal gradient tubes in red-to-cyan that create a 3D ribbon effect against the deep black background - these organic, flowing forms contrast sharply with typical geometric tech designs.
Subtle rounded corners at 6px with medium font weights, buttons feel substantial but not heavy. Components have gentle curves rather than sharp edges, creating approachability within the technical darkness. No harsh shadows, relying on subtle borders and background variations.
Generous macro spacing with 32px grid gaps creates breathing room around hero content, while conservative micro spacing keeps UI elements cohesive. The layout feels expansive yet controlled, with plenty of negative space amplifying the gradient focal point.
Power users and developers who want sophisticated productivity tools - people who appreciate dark interfaces and value both performance and visual craft in their daily workflows.
Design descriptions are AI-generated based on visual analysis and may not fully reflect the brand's official design guidelines.
| Element | Font | Size | Weight | Line Height |
|---|---|---|---|---|
| body | 16px | 400 | 18.4px | |
| h1 | 64px | 600 | 70.4px | |
| h2 | 20px | 500 | normal | |
| h3 | 24px | 500 | normal | |
| h4 | 24px | 500 | 38.4px | |
| h5 | 18px | 400 | normal | |
| p | 18px | 400 | normal | |
| a | 16px | 400 | 18.4px | |
| button | 12px | 400 | 13.8px | |
| input | 14px | 500 | 16.1px |
#07080a#101111#18191a#313133#494b4d#c2c7ca#78787c#5e6366#0d0d0d#121212