Accessibility shouldn't be something you bolt on at the end. When we built Hux UI, we wanted WCAG compliance baked into every component, so developers get it for free, without thinking about it.
The Problem
Most design systems give you preset color combos that pass contrast checks. But the moment you use a custom brand color, you're on your own. White text on a light background? Unreadable—and you won't notice until someone tells you.
We didn't want that. We wanted Hux components to handle contrast automatically, no matter what color you throw at them.
How It Works
Every Hux button calculates its own text color at render time. It measures the WCAG contrast ratio between the background and both light and dark text options, then picks whichever one is more readable. The math follows the sRGB luminance formula with proper gamma correction—the same algorithm used by tools like WebAIM's contrast checker.
The result: pass in any color and the text is always legible. No manual checking, no guesswork.
Semantic Tokens for Theming
Contrast is only half the story. Hux uses semantic design tokens—like textPrimary and surfaceElevated—that automatically adapt between light and dark mode. Components reference tokens instead of raw colors, so theme switching just works without any per-component overrides.
Why It Matters
Accessibility is often treated as a checklist item. We think it should be invisible infrastructure—something the system guarantees so developers can focus on building. With Hux, WCAG AA compliance isn't a feature you opt into. It's just how the components work.