⚡ Workplace Quick-Switch Dock(Jump between 43 Everyday Studios)
Tailwind CSS v4 & WCAG 2.1 Compliant
Perceptual Palette & Accessibility Contrast Studio
Input any brand hex color. Generate smooth 50–950 shade stops, verify accessibility contrast ratios against white and black text, and export design tokens.
Base Hex
Generated Tailwind v4 Palette Stops (50–950)
WCAG 2.1 Contrast Matrix (Base Color)
Contrast on White (#FFFFFF)
2.15:1
AA Normal (≥4.5):FAIL ✕
AA Large (≥3.0):FAIL ✕
Contrast on Black (#000000)
9.78:1
AA Normal (≥4.5):PASS ✓
AA Large (≥3.0):PASS ✓
Live Component Preview
Active Badge
Glassmorphism Container Card
Subtle tint blending your brand accent with dark backdrop mode.