CSS Gradient
cssgradient.io
Builds a linear or radial gradient and hands you the CSS to paste
No sign-upOn device
Loading page
webaim.org
Tells you whether two colours pass WCAG contrast, and by how much.
Enter a foreground and a background and it returns the contrast ratio with pass or fail for WCAG AA and AAA at normal and large text sizes, plus lightness sliders that let you nudge one colour until it passes. WebAIM are the accessibility people everyone else cites, so this is the number to quote in a design review. It runs entirely in the page.
AltFTool does this too
If you would rather not leave the site, Color Contrast Checker covers the same job here — free, no account, and it runs in your browser.
Open Color Contrast CheckerQuestions
Works the moment the page loads. No account, no email, no trial. One colour pair at a time — auditing a whole page needs WebAIM's separate WAVE tool or a browser audit.
No. WebAIM Contrast Checker does the work inside your browser, so the file never leaves your device — you can load the page, disconnect from the network, and it still works. That makes it a reasonable choice for material containing personal data.
One colour pair at a time — auditing a whole page needs WebAIM's separate WAVE tool or a browser audit.
Alternatives
Same category or same task, ordered by how closely they overlap.
cssgradient.io
Builds a linear or radial gradient and hands you the CSS to paste
realtimecolors.com
Previews a palette on a real page layout instead of five swatches
coolors.co
Hit the space bar until a five-colour palette appears that works
fontawesome.com
A large icon set with a free tier you can ship without attribution
fontsquirrel.com
Free fonts hand-checked for a genuinely commercial licence
fontjoy.com
Suggests heading and body font pairings, and locks the one you like