← Back to Dashboard

🎨 Color & Contrast

Color palette, accessibility, and contrast ratios

Primary Color Palette

Pending Review

Main brand colors used throughout the interface for consistency.

#7c3aed
#fbbf24
#1a1a2e
#16213e
Requirements
Consistent brand colors
Proper color hierarchy
Documented hex values
Design system integration

Text Contrast Ratios

Pending Review

All text elements must meet WCAG AA standards for contrast ratios (4.5:1 for normal text, 3:1 for large text).

Requirements
Body text: 4.5:1 minimum
Headings: 3:1 minimum
Links clearly distinguishable
Disabled state still readable

Semantic Color Usage

Pending Review

Colors should convey meaning consistently across the interface.

Success
Warning
Error
Info
Requirements
Green for success/positive
Yellow/orange for warning
Red for errors/danger
Blue for information

Dark Mode Support

Pending Review

Proper color adjustments for dark mode while maintaining contrast and readability.

Requirements
Dark background colors
Adjusted text brightness
Reduced pure white usage
Softer accent colors

Focus Indicators

Pending Review

Clear visual indicators for keyboard navigation and focus states.

Requirements
2px minimum outline width
High contrast focus color
Visible on all backgrounds
No reliance on color alone

Gradient Usage

Pending Review

Consistent and accessible gradient implementations across the interface.

Requirements
Subtle gradient transitions
Text remains readable
Consistent angle/direction
Performance optimized