Fargekontrastkontroll

Kom godt i gang

Dette verktøyet hjelper deg med å sjekke om fargekombinasjonene dine oppfyller WCAG 2.2-standardene for universell utforming. Angi en forgrunnsfarge (tekstfarge) og en bakgrunnsfarge for å se kontrastforholdet og samsvarsstatus.

Sikt på minst 4.5:1 for normal tekst (AA) eller 7:1 for økt tilgjengelighet (AAA).

Legge inn farger

Angi farger ved hjelp av :

• Fargevelger: Klikk på den fargede firkanten for visuelt valg
• Hex: Skriv inn koder som #FF5733 eller FF5733
• RGB: Verdier fra 0-255 for rød, grønn og blå
• HSL: Fargetone (0-360), Metning (0-100%), Lyshet (0-100%)
• HSV: Fargetone (0-360), metning (0-100%), verdi (0-100%)
• Fargenavn: CSS-navn som rød, mørkegrå

EyeDropper-verktøyet

Velg hvilken som helst farge fra skjermen med pipetteknappen.

Fargeglidebrytere og alfa

Klikk på "Colour Sliders" for å åpne justerbare kontroller:

• RGB: Rød, grønn, blå (0-255)
• HSL: Fargetone, metning, lyshet
• HSV: Fargetone, metning, verdi
• Alfa: Åpenhet (0-1)

WCAG 2.2 Suksesskriterier

Foreslåtte farger for universell utforming

Når kontrasten svikter, foreslår verktøyet tilgjengelige alternativer:

• AA/AAA Forslag: Farger som oppfyller kravene
• Klikk for å søke: Klikk på et forslag for å bruke det
• Angre: Gå tilbake med Angre-knappen

Visjonssimulering

Forhåndsvis hvordan farger vises under ulike synsforhold:

• Protanopi/Deuteranopi/Tritanopi: Typer fargeblindhet
• Monokromi: Fullstendig fargeblindhet
• Synsskarphet: Uklart syn (20/40 til 20/400)
• Tunnelsyn: Perifert synstap

Kopiering av resultater

• Kopier sammendrag: Kort kontrastforhold og status
• Kopier detaljert: Fullstendig rapport om WCAG-samsvar
• Kopier farge: Individuelle fargeverdier

Tastaturnavigasjon

• Tab - Navigere kontroller
• Flukt - Lukk dialogbokser
• Piltastene - Juster glidebryterne