Daily Toolkits

Fargekontrastkontroll

Sjekk forgrunns-/bakgrunnskontrasten mot WCAG AA og AAA. Se forholdsoppdateringen mens du velger farger.

Color Contrast Checker

Live

17.85:1

Contrast ratio

AA normal: PassAA large: PassAAA normal: PassAAA large: Pass

Readable headline sample

Body text at normal size should stay clear against this background. Adjust colors until WCAG targets pass.

Small caption text for density checks.

CSS output

color: #0f172a;
background-color: #ffffff;
/* contrast ratio: 17.85:1 */

Key capabilities

  • Sjekk forgrunns-/bakgrunnskontrasten mot WCAG AA- og AAA-retningslinjene.
  • Kjører i nettleseren din
  • Gratis å bruke

Hvordan bruke

  1. Velg tekst (forgrunn) og bakgrunnsfarger.
  2. Les kontrastforholdet og AA/AAA-resultatene.
  3. Juster til du passerer målnivået ditt.

How this tool works

  1. Velg tekst (forgrunn) og bakgrunnsfarger.
  2. Les kontrastforholdet og AA/AAA-resultatene.
  3. Juster til du passerer målnivået ditt.

Recommended settings

  • Bruk standardalternativene først, og juster deretter om nødvendig

Supported formats

Text / on-page input

File size and limits

  • Svært komplekse forhåndsvisninger i flere lag kan føles tregere på eldre telefoner.

Privacy

Farge- og CSS-generatorer kjører utelukkende i nettleseren din. Forhåndsvisninger og konverteringer laster aldri opp stilene dine.

Common use cases

  • Bruk Color Contrast Checker når du trenger det: Sjekk forgrunns-/bakgrunnskontrasten mot WCAG AA- og AAA-retningslinjene.

Troubleshooting

Forhåndsvisning ser annerledes ut etter innliming

Se etter konkurrerende CSS på siden din (tilbakestillinger, arvede farger). Kopier den genererte regelen inn i et isolert stilark først.

FAQ

Laster dette opp min CSS?

Nei. Generatorer og omformere kjører i nettleseren din med live forhåndsvisning.

Trenger jeg en konto?

Nei. Åpne verktøyet, juster kontroller og kopier CSS.

Relaterte verktøy

HEX ↔ RGB ↔ HSL Converter

Convert colors between HEX, RGB, and HSL instantly with a live swatch.

Open tool

Text Shadow Generator

Craft readable text-shadow styles with live typography preview.

Open tool

CSS Gradient Generator

Build linear, radial, and conic gradients with live preview and copy-ready CSS.

Open tool