Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Prisma
Dev ToolsPrisma creates a developer-focused aesthetic that balances technical precision with approachable elegance. The teal signature color evokes trustworthy depth while the generous whitespace and confident typography hierarchy suggest premium infrastructure tooling for serious developers.
Design Identity
Signature Color
Prisma Teal
#0d9488
Developer-grade reliability with modern sophistication - trustworthy enough for production databases yet approachable for rapid prototyping
Visual Identity
Massive typographic statements on pristine white backgrounds with surgical precision in spacing - the brand feels like premium developer infrastructure that doesn't compromise on aesthetics
Component Style
Soft 6px rounded corners with solid teal fills, no shadows or borders - buttons feel substantial yet refined, prioritizing clarity over decoration
Spacing Philosophy
Cathedral-like vertical spacing with 80px+ between major sections creates breathing room, while tight component spacing maintains scan-ability - optimized for developer focus and comprehension
Design Principles
- Typography jumps from 16px body to 64px headlines with no intermediate sizes
- Border radius never exceeds 8px - maintaining professional restraint
- Teal accent color used sparingly for maximum impact on CTAs
- Generous 40px+ padding around primary buttons
- Mona Sans VF for headlines, Inter for body - clear hierarchy distinction
Target Audience
Senior full-stack developers and engineering teams who need enterprise-grade database tooling but expect modern developer experience and beautiful documentation
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 | 400 | 24px | |
| h1 | 64px | 400 | 72px | |
| h2 | 36px | 900 | 48px | |
| h3 | 24px | 700 | 32px | |
| h5 | 16px | 400 | 24px | |
| h6 | 12px | 400 | 16px | |
| p | 16px | 400 | 24px | |
| a | 16px | 600 | 24px | |
| button | 16px | 600 | 24px | |
| nav | 16px | 400 | 24px |
Color Palette
#0d9488#ffffff#f0f9ff#fefce8#f7fafc#dc2626#ca8a04#e0e7ff#9333ea#14b8a6#0ac864#c80a64
