See every colour that works with yours
Pick a text colour and see the whole map of backgrounds that pass, with the lines where contrast flips. Drag around. Copy the fix.
Contrast Lab
Live, step 4 of 4Every background for your text colour on one plane, with the WCAG lines drawn across it.
by vibFolio Design0 followersstarted contrastlab-ten.vercel.app
Your build in one picture
The Glow-Up: the first picture beside the newest, with how long it took. It needs two different pictures in the log. A Pro card is larger and has no vibFolio mark.
https://www.vibfolio.com/vibfolio_design/contrast-lab/glow-upOn your README
A badge with the stage and the newest entry, linking back to this build log. It updates on its own.
[](https://www.vibfolio.com/vibfolio_design/contrast-lab)On your own site
The 3 newest entries, drawn on your own page. Add ?theme=light or ?theme=dark to the address to choose a look; without it, it follows the visitor’s own setting.
<iframe src="https://www.vibfolio.com/embed/vibfolio_design/contrast-lab" title="Contrast Lab on vibFolio" width="100%" height="340" style="border:0;max-width:560px" loading="lazy"></iframe>With Pro, add ?footer=off to drop the vibFolio line and ?entries=10 (up to 25) to show more, in a taller frame.
- Idea
- Building
- Beta
- Live
Loading entries
Built by
1- vibFolio DesignOwner@vibfolio_design
vibFolio Design builds this alone. See the Builders tab