The AI Color Tool
Built to make you extraordinarily accessible, weableColor is the best way to create WCAG-compliant colors with AI.
Stop Guessing. Start Designing with Confidence.
weableColor solves your toughest accessibility challenges, so you can build beautiful, compliant interfaces faster.
Precise WCAG & APCA Checks
Tired of manual checks? Instantly calculate accurate contrast ratios for both WCAG 2.1 AA/AAA and APCA standards, ensuring your colors are always compliant.
Intelligent Color Fixing
Stuck with failing colors? Automatically find the minimum, most aesthetic adjustment needed to meet contrast targets, saving you time and design integrity.
Dynamic Palette Generation
Struggling to build accessible themes? Quickly generate harmonious and accessible color schemes based on your primary color, ensuring brand consistency and compliance.
Robust Color Manipulation
Need precise color control? Access powerful functions for seamless color conversion (RGB, HSL, Hex), lightening, darkening, blending, and more, all while maintaining accessibility.
Perfect For
Frontend Developers
Integrate automated accessibility checks directly into your development workflow to build compliant UI components with confidence.
Design Systems Teams
Automate color compliance checks and maintain a centralized repository of accessible color palettes, ensuring consistency across all products.
Agencies & Freelancers
Deliver accessible websites and applications faster and more reliably for your clients, enhancing your reputation and client satisfaction.
Tool Builders
Empower your own products with powerful, battle-tested color accessibility logic via our comprehensive library or API, reducing development time.
See weableColor Tools in Action
Experience the power of accessible color tools in your workflow
Terminal Workflow Demo
See how developers use our CLI tools in real workflows
weableColor Terminal
$
Quick Start Examples
Basic Usage
Get started with basic contrast checking
npm install @weable-tools/a11y-color-utils
import { calculateContrastRatio, checkContrast } from '@weable-tools/a11y-color-utils';
// Check if colors meet WCAG AA standards
const ratio = calculateContrastRatio('#ffffff', '#000000');
const isAccessible = checkContrast('#ffffff', '#000000', 'AA');
console.log(`Contrast ratio: ${ratio}`);
console.log(`WCAG AA compliant: ${isAccessible}`);Advanced Features
Generate accessible color palettes automatically
// Generate accessible color palette
import { generateAccessiblePalette } from '@weable-tools/a11y-color-utils';
const palette = generateAccessiblePalette('#0078D7', {
targetContrast: 4.5,
includeVariants: true
});
console.log(palette);
// Output: { primary: '#0078D7', light: '#4A9DE8', dark: '#005A9E', ... }Your New Favorite Design Tool
The weableColor Figma Plugin brings accessibility-first color design directly into your workflow
Generate accessible color palettes, analyze contrast ratios, and get smart suggestions for accessibility improvements—all without leaving Figma.
What You'll Get
Smart Palette Generation
Create WCAG-compliant color schemes from any base color in seconds
Real-time Analysis
Check contrast ratios and accessibility compliance instantly
Intelligent Suggestions
Get specific recommendations for accessibility improvements
Coming Soon
Join the waitlist to be first in line when we launch. Help us shape the future of accessible design in Figma.
Trusted by Developers Worldwide
Join developers worldwide building accessible products with confidence
Join the accessibility revolution!Alex Johnson
UX Designer @ Innovatech
“This tool fundamentally changed how I approach color selection. Ensuring AA/AAA compliance is now effortless.”
Samantha Lee
Frontend Developer @ CodeCrafters
“Integrating the color utils library was seamless. It caught contrast issues I would have missed.”
Maria Garcia
Accessibility Consultant
“I recommend weableColor Utils to all my clients. It simplifies a complex aspect of accessibility.”
Kenji Tanaka
Digital Agency Owner
“Ensuring our client sites are accessible is crucial. This tool makes achieving color compliance straightforward.”
The Future of Accessible Design is Coming
We're building something revolutionary for designers. The weableColor Figma Plugin will transform how you approach accessibility in your design workflow.
Join our growing global community of designers and developers who are already using weableColor to build accessible experiences. Be the first to know when our Figma Plugin launches and get exclusive early access.
🎯 What's Next?
Our Figma Plugin is in active development. We're focusing on seamless integration, real-time accessibility feedback, and a design experience that feels native to Figma. Sign up for updates and help us shape the future of accessible design tools.