Gå til innholdet

Fargekontrastsjekk

Do4U sjekker kontrasten i merkevare- og nettstedsfargene dine. Du skriver inn fargene, én per linje, og oppgir hva hver farge brukes til: tekst, bakgrunn, aksent (for eksempel en knapp) eller kantlinje. Koden beregner kontrastforholdet for hvert par med WCAG-formelen og viser hvilke nivåer det når: AA og AAA for normal og stor tekst, og 3:1 for kantlinjer, ikoner og knappeflater. Verdiene rundes ikke opp. For hvert par som ikke består, får du den nærmeste fargen som består, én gang mørkere og én gang lysere, i samme fargetone. Do4U lager også en justert palett og sjekker den på nytt som helhet. Du eksporterer paletten som egendefinerte CSS-egenskaper, SCSS-variabler eller JSON, og eksporten lages i nettleseren din. Alt kjøres i kode, uten KI, og det er gratis.

Prøv nå Priser

Gratis og uten konto: Kalkulator for kontrastforhold →

Hvem det er for

For designere, utviklere, byråer og nettstedeiere som velger merkevarefarger eller lager en stilguide og vil ha tekst og knapper som alle kan lese.

Typisk bruk

  • Sjekk en ny merkevarepalett før designarbeidet starter
  • Finn en grå farge for sekundærtekst som fortsatt består AA
  • Sjekk farger på knapper, lenker og kantlinjer mot sidebakgrunnen
  • Eksporter de justerte fargene som CSS-variabler til stilarket ditt

Eksempel

Inndata

#1a1a1a text #777777 text Secondary #ffffff background #cccccc border

Resultat

#1a1a1a på #ffffff: 17,4:1, består AA og AAA #777777 på #ffffff: 4,47:1, består ikke AA for normal tekst (består for stor tekst). Mørkere: #767676 → 4,54:1. Lysere: ikke mulig #cccccc på #ffffff: 1,6:1, består ikke ikke-tekstkontrasten på 3:1. Mørkere: #949494 → 3,03:1 Eksport (justert): :root { --color-text: #1a1a1a; --secondary: #767676; --color-background: #ffffff; --color-border: #949494; }

Et fast eksempel, forkortet. Ekte resultater er KI-generert: sjekk dem.

Pris og grenser

Pris
gratis, opptil 30 sjekker per dag
Tilgjengelig med
Gratis, Med pakke
Inndatagrense
Opptil 3 000 tegn per fil

Personvern

Behandles på våre egne servere i EU (Polen). Inndata og resultater slettes etter 7 dager (Gratis) eller 30 dager (pakker), eller rett etter at du har sett resultatet hvis du velger å ikke lagre dem. Bilder slettes rett etter behandlingen.

I API-et

Verktøynavn: contrast_check. Opprett en jobb med POST /api/v1/jobs og hent resultatet med GET /api/v1/jobs/{id}. API-nøkkelen din finner du i kontoen din.

curl -X POST https://do4u.eu/api/v1/jobs \
  -H "Authorization: Bearer d4u_…" -H "Content-Type: application/json" \
  -d '{"tool": "contrast_check", "colors": ["#1a1a1a text", "#ffffff background", "#0066cc accent"]}'

Fullstendig API-dokumentasjon →

Spørsmål og svar

Hvordan beregnes kontrastforholdet?

Med formelen i WCAG 2.2: først den relative luminansen for hver farge, deretter (L1 + 0,05) / (L2 + 0,05), der L1 er den lyseste fargen. Resultatet ligger mellom 1:1 og 21:1. Verdiene sammenlignes uten avrunding, så 4,49:1 når ikke 4,5:1, og visningen runder aldri opp.

Hvilke par sjekkes?

Tekst sjekkes på hver bakgrunn og på aksentfarger, mot 4,5:1 og 7:1 for normal tekst og 3:1 og 4,5:1 for stor tekst. Aksent- og kantlinjefarger sjekkes på bakgrunnen mot 3:1 for ikke-tekstkontrast. En farge uten rolle sammenlignes med alle de andre fargene.

Hvordan finnes de foreslåtte fargene?

Bare lysheten endres, i fargerommet OKLCH; fargetonen forblir den samme. Do4U ser etter den nærmeste fargen som består, én gang mørkere og én gang lysere, og sjekker den på nytt som heksadesimal kode. Hvis ingen farge kan bestå mot en bakgrunn, sier verktøyet det.

Blir teksten min lagret?

Bare så lenge det trengs: 7 dager med Free, 30 dager med en pakke – eller slett ikke hvis du velger å ikke lagre den. Behandlingen skjer på våre egne servere i EU (Polen).

Kan jeg bruke resultatet med en gang?

Resultatene er laget av KI. Les dem gjennom før du publiserer eller sender dem.

Relaterte verktøy

  • Tilgjengelighetskontroll

    Kontrollerer en side for vanlige barrierer og forklarer hvordan de kan rettes.

  • Designtilbakemelding fra et skjermbilde

    Last opp et skjermbilde av en side eller app og få nummererte, konkrete funn om knappestørrelse, kontrast, tekst i bilder, hierarki og avstand, hvert med en ramme på bildet. En KI-vurdering, ikke en måling.

  • Alt-tekster

    Korte bildebeskrivelser for skjermlesere og søkemotorer.

Alle verktøy →