Dynamic Runtime Theming with APCACH + Tailwind
Change your entire color scheme instantly with guaranteed accessibility. No rebuilds, no massive CSS bundles. Just beautiful, accessible themes powered by APCACH.
<!-- All these classes automatically adapt to theme changes and dark mode -->
<button class="bg-primary-500 text-primary-50 hover:bg-primary-600">
Primary Button
</button>
<div class="bg-success-50 border-success-200 text-success-800"> ✓ </div>
<p class="text-text-600">Greetings</p>
Quick Theme Selection
Customize Colors with APCACH
Adjust hue (0-360°) and chroma (0-0.4) to create accessible color palettes. APCACH generates all shades with guaranteed APCA contrast ratios.
Component Examples
Buttons
APCACH-Powered
Dynamic color generation with guaranteed APCA contrast ratios for perfect accessibility.
Hue + Chroma System
Define colors using hue (0-360°) and chroma (0-0.4) instead of hex codes.
Guaranteed Accessible
Every generated color meets APCA contrast standards automatically.
Status Messages
Typography
Heading 1 - Bold Title
Heading 2 - Section Title
Heading 3 - Subsection
This is regular body text using the text color token. It automatically adapts to your theme and provides consistent readability.
Smaller, secondary text for less important information or captions.
Fine print or metadata that should be subtle but still readable.