ADVERTISEMENT
Google AdSense Slot (headerLeaderboard)
Set your Publisher ID in src/config/ads.ts to display live ads.
Responsive Web Design, Colors & UI Systems• 6 min read
Color Palettes, Hex, HSL & WCAG Contrast
Understand Hex, RGB, and HSL color models, and guarantee your text meets WCAG AA 4.5:1 contrast requirements.
Why HSL is Superior for UI Themes
Hexadecimal (#3b82f6) and RGB (rgb(59, 130, 246)) are hard to tweak mentally. HSL (Hue, Saturation, Lightness) lets you change lightness or create harmonious hover states by adjusting a single number.
ADVERTISEMENT
Google AdSense Slot (inContentBanner)
Set your Publisher ID in src/config/ads.ts to display live ads.
Test Yourself With Exercise
Under WCAG 2.1 AA accessibility guidelines, what is the minimum contrast ratio required for normal body text against its background?