Brand Kit

Back to Dashboard
Brand Colors
Primary Purple
#8b5cf6
Accent Pink
#ec4899
Warning Orange
#f59e0b
Success Green
#10b981
Dark Blue
#1a1a2e
Deep Blue
#0f0f23
Pure White
#ffffff
Light Gray
#a1a1aa
Typography
Inter (Primary)
The quick brown fox
Headings, body text, UI elements
Space Grotesk (Accent)
The quick brown fox
Display text, special headings
JetBrains Mono (Code)
The quick brown fox
Code snippets, technical content
Logo Variants
S
Primary Logo
S
Light Background
S
Dark Background
S
Circular Variant
Brand Assets
Logo PNG
High Resolution
Logo SVG
Vector Format
Brand Guide
PDF Document
Social Media Kit
Multiple Formats
Brand Guidelines
Logo Usage
Always maintain clear space around the logo equal to the height of the "S" icon. Never distort, rotate, or modify the logo proportions. Use the appropriate variant for your background color.
Color Usage
Primary purple (#8b5cf6) should be used for main actions and highlights. Accent pink (#ec4899) is for secondary actions and decorative elements. Maintain sufficient contrast ratios for accessibility.
Typography
Use Inter for all body text and UI elements. Space Grotesk is reserved for display headings and special emphasis. Maintain consistent font weights and sizes throughout your designs.
Spacing & Layout
Use consistent spacing units based on 8px grid system. Maintain proper margins and padding for readability. Follow the established visual hierarchy in all designs.