APCA Contrast Calculator
apcacontrast.comCompare text contrast with its size, weight and colour direction in view.
Compare text contrast with its size, weight and colour direction in view.
Sample a foreground and background pair and copy its contrast report.
Adjust text and background colours while checking their contrast.
Find replacement colours that meet a chosen contrast target.
Share a colour pair with its WCAG text-contrast result.
Adjust CSS colour pairs and inspect their changing contrast ratio.
Check text and interface contrast with transparency and lightness controls.
Build interface colour scales with shade curves and contrast targets.
Choose numbered shades whose separation indicates minimum contrast.
Adjust CSS colours and calculate contrast with focused JavaScript functions.
Collect screen or camera colours into palettes for design-file exports
Shape a complete interface palette while checking colour-pair contrast.
Connect browser colour picking with shareable palettes and scales.
Generate interface themes from target contrast ratios and colour scales.
Browse shared palettes, gradients and image-based colour inspiration.
View text contrast through different vision and lighting simulations.
See how a colour pair performs for different text sizes.
Explore photograph-based palettes with copyable hex colours and related combinations.
Check colour pairs, sample an image and collect results for a PDF.
Five-colour palettes drawn from named paintings and their artists
Convert colour values and collect palettes for design or code.
Connect physical colour references with digital palettes and design files.
Find a shared palette, generate one from words or scan an image.
Generate a configurable set of separated category colours.