fix: improve accent color contrast for WCAG AA compliance
Add WCAG AA compliant accent color variants and update default accent to meet 4.5:1 contrast ratio requirements. - Add --t-accent-text (darker for text on light backgrounds) - Add --t-accent-button (darker for button backgrounds with white text) - Change default accent from #3b82f6 to #2563eb (better contrast) - Update presets and tests for new default These changes ensure accent colors meet accessibility standards while maintaining visual consistency with the brand palette. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -23,6 +23,12 @@
|
||||
--t-accent-subtle: hsl(var(--t-accent-h) 40% 95%);
|
||||
--t-accent-ring: hsl(var(--t-accent-h) var(--t-accent-s) var(--t-accent-l) / 0.4);
|
||||
|
||||
/* WCAG AA compliant accent variants for better contrast */
|
||||
/* Darker accent for text on light backgrounds (4.5:1 with white) */
|
||||
--t-accent-text: hsl(var(--t-accent-h) var(--t-accent-s) 38%);
|
||||
/* Darker accent for button backgrounds to ensure 4.5:1 with white text */
|
||||
--t-accent-button: hsl(var(--t-accent-h) var(--t-accent-s) 42%);
|
||||
|
||||
/* Secondary colors */
|
||||
--t-secondary-accent: #ea580c;
|
||||
--t-sale-color: #dc2626;
|
||||
|
||||
Reference in New Issue
Block a user