Color contrast checker — free for any website

WCAG contrast ratio for any foreground and background pair.

Utility & badges

your-site.com — live preview

What is Color contrast checker?

Color contrast checker is one of 590+ free widgets on PlanckUi. WCAG contrast ratio for any foreground and background pair. Badges, notices and small utilities quietly answer questions so visitors don't have to ask.

Use anywhere a small element can remove a doubt or add credibility.

Everything is rendered in an isolated shadow DOM, so it can never conflict with your site's own styles — and at a few kilobytes, it won't move your page speed.

Everything included

  • WCAG contrast ratio for any foreground and background pair.
  • Free forever — no watermark, no usage limits, no "upgrade to remove"
  • Customize everything: colors, fonts, corner radius, shadows, dark mode
  • Copy-paste install: one snippet of HTML works on any website builder

Add Color contrast checker to your website in 3 steps

  1. Customize it. Use the Paint editor right on this page — set your colors, fonts, radius and content. Color contrast checker updates live as you change things.
  2. Copy the HTML. One click gives you a self-contained snippet. No account needed, nothing to install, no script from our servers.
  3. Paste it on your site. Paste it anywhere HTML goes: your site, a landing page, WordPress, Webflow, Wix, Squarespace, Shopify, Ghost — if it renders HTML, it works.

Color contrast checker is free on PlanckUi — the same embed runs $15–40/month on Elfsight or Common Ninja. No watermark, no usage limits, no credit card.

Frequently asked questions

Is Color contrast checker really free?
Yes — completely. PlanckUi widgets are free forever, with no watermark, no usage limits and no credit card. Paid widget platforms charge $15–40 per month for the same embeds.
Do I need an account to use Color contrast checker?
No. Click "Copy HTML" and paste it on your site — that's the whole flow. An account is only needed if you want to collect live data (like customer testimonials) and manage it from a workspace.
Does it work on Wix, Squarespace, Webflow, WordPress or Shopify?
Yes. If a platform lets you paste an HTML embed block — and all of them do — Color contrast checker works there. The snippet is plain HTML and CSS in an isolated shadow root, so it can't fight with your theme.
Will Color contrast checker slow down my website?
No. The widget is a few kilobytes of HTML and CSS rendered locally in your browser — no external requests, no tracking scripts, no layout shift.

More free widgets like this

Browse the full catalog of 590+ free widgets.