Accessible Button Hover & Focus Ring Colors Guide — Interactive Studio & Export
Learn how to design WCAG 2.2 compliant button hover, active, and keyboard focus ring colors that pass 3:1 contrast against backgrounds without muddy shift.
Active Color Swatches & Shades
- #0066FF — HEX, RGB, HSL & Shade Scale
- #FF2E63 — HEX, RGB, HSL & Shade Scale
- #F59E0B — HEX, RGB, HSL & Shade Scale
- #10B981 — HEX, RGB, HSL & Shade Scale
- #06B6D4 — HEX, RGB, HSL & Shade Scale