Color Palette
Background Colors
Border Colors
Content
Text, Buttons, Icons, etc
Accent
- Used for Badges, alerts, success states, errors, etc
Brand Colors
Details:
| Use | Hex | Tailwind |
|---|---|---|
| Background Main | #FFFFFF | white |
| Background Secondary | #F9FAFB | bg-gray-50 |
| Background Tertiary | #F3F4F6 | bg-gray-100 |
| Border Main | #F3F4F6 | border-gray-100 |
| Border Strong | #E5E7EB | border-gray-200 |
| Content Disabled | #D1D5DB | gray-300 |
| Content Subtle | #9CA3AF | gray-400 |
| Content Normal | #6B7280 | gray-500 |
| Content Muted | #374151 | gray-700 |
| Content Strong | #030712 | gray-950 |
| Accent Success Background | #D1FAE5 | bg-emerald-100 |
| Accent Success Content | #10B981 | emerald-500 |
| Accent Error Background | #FFE4E6 | bg-rose-100 |
| Accent Error Content | #F43F5E | rose-500 |
| Accent Alert Background | #FFEDD5 | bg-orange-100 |
| Accent Alert Content | #F97316 | orange-500 |
| Brand Background | #E0EFFC | |
| Brand Content | #268AE2 |