Színkontraszt-ellenőrzés

A Do4U ellenőrzi a márka- és weboldalszíneid kontrasztját. Megadod a színeidet, soronként egyet, és azt, hogy mire szolgál az adott szín: szöveg, háttér, kiemelés (például egy gomb) vagy szegély. A kód minden pár kontrasztarányát kiszámítja a WCAG-képlettel, és megmutatja, mely szinteket éri el: AA és AAA normál és nagy szövegnél, valamint 3:1 szegélyeknél, ikonoknál és gombfelületeknél. Az értékeket nem kerekítjük felfelé. Minden meg nem felelő párhoz megkapod a legközelebbi megfelelő színt, egyszer sötétebben, egyszer világosabban, ugyanabban a színárnyalatban. A Do4U egy módosított palettát is összeállít, és egészében újra ellenőrzi. A palettát CSS custom propertyként, SCSS-változóként vagy JSON-ként exportálod, és az export a böngésződben készül. Minden kóddal fut, AI nélkül, és ingyenes.

Próbáld ki most Árak

Ingyenesen és fiók nélkül: Kontrasztarány-kalkulátor →

Kinek szól

Tervezőknek, fejlesztőknek, ügynökségeknek és weboldal-tulajdonosoknak, akik márkaszíneket választanak vagy stílusútmutatót készítenek, és olyan szövegeket és gombokat szeretnének, amelyeket mindenki el tud olvasni.

Tipikus felhasználások

Új márkapaletta ellenőrzése a tervezés kezdete előtt
Olyan szürke keresése másodlagos szöveghez, amely még megfelel az AA szintnek
Gomb-, link- és szegélyszínek ellenőrzése az oldal hátterén
A módosított színek exportálása CSS-változóként a stíluslapodhoz

Példa

Bemenet

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

Eredmény

#1a1a1a a #ffffff háttéren: 17.4:1, megfelel az AA és AAA szintnek #777777 a #ffffff háttéren: 4.47:1, normál szövegnél nem felel meg az AA szintnek (nagy szövegnél megfelel). Sötétebb: #767676 → 4.54:1. Világosabb: nem lehetséges #cccccc a #ffffff háttéren: 1.6:1, nem felel meg a 3:1 arányú nem szöveges kontrasztnak. Sötétebb: #949494 → 3.03:1 Export (módosított): :root { --color-text: #1a1a1a; --secondary: #767676; --color-background: #ffffff; --color-border: #949494; }

Rögzített, rövidített példa. A valódi eredményeket MI állítja elő: kérlek, ellenőrizd őket.

Ár és korlátok

Ár: ingyenes, napi legfeljebb 30 ellenőrzés
Elérhető ezzel: Ingyenes, Csomaggal
Bemeneti korlát: Fájlonként legfeljebb 3 000 karakter

Adatvédelem

Saját szervereinken dolgozzuk fel az EU-ban (Lengyelország). A bemenetek és az eredmények 7 nap (Ingyenes) vagy 30 nap (csomagok) után törlődnek, illetve közvetlenül az eredmény megtekintése után, ha a tárolás mellőzését választod. A képek a feldolgozás után azonnal törlődnek.

Az API-ban

Az eszköz neve: contrast_check. Hozz létre egy feladatot a POST /api/v1/jobs híváshoz, és kérd le az eredményt a GET /api/v1/jobs/{id} hívással. Az API-kulcsodat a fiókodban találod.

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"]}'

Teljes API-dokumentáció →

Kérdések és válaszok

Hogyan számítjuk ki a kontrasztarányt?

A WCAG 2.2 képletével: először az egyes színek relatív fénysűrűségét, majd az (L1 + 0.05) / (L2 + 0.05) értéket, ahol L1 a világosabb szín. Az eredmény 1:1 és 21:1 között van. Az értékeket kerekítés nélkül hasonlítjuk össze, így a 4.49:1 nem éri el a 4.5:1-et, és a kijelzés soha nem kerekít felfelé.

Mely párokat ellenőrizzük?

A szöveget minden háttéren és kiemelő színen ellenőrizzük, normál szövegnél 4.5:1 és 7:1, nagy szövegnél 3:1 és 4.5:1 arányra. A kiemelő és szegélyszíneket a háttéren 3:1 arányra ellenőrizzük a nem szöveges kontraszt szerint. A szerep nélküli színt minden más színnel összehasonlítjuk.

Hogyan találjuk meg a javasolt színeket?

Csak a világosság változik, az OKLCH színtérben; a színárnyalat ugyanaz marad. A Do4U megkeresi a legközelebbi megfelelő színt, egyszer sötétebben, egyszer világosabban, és hexakódként újra ellenőrzi. Ha egy háttéren egyetlen szín sem felelhet meg, ezt jelzi.

Eltárolják a szövegemet?

Csak addig, amíg szükséges: 7 napig a Free csomagban, 30 napig fizetős csomaggal – vagy egyáltalán nem, ha úgy döntesz, hogy nem kéred a tárolást. A feldolgozás a saját szervereinken történik az EU-ban (Lengyelország).

Használhatom az eredményt azonnal?

Az eredményeket MI állítja elő. Kérjük, olvasd át őket, mielőtt közzéteszed vagy elküldöd.

Kapcsolódó eszközök

Akadálymentesség-ellenőrzés
Ellenőrzi az oldalt a gyakori akadályok szempontjából, és elmagyarázza, hogyan javíthatók.
Dizájnvisszajelzés képernyőképből
Tölts fel egy oldalról vagy alkalmazásról készült képernyőképet, és kapj számozott, konkrét megállapításokat a gombméretről, a kontrasztról, a képeken lévő szövegről, a hierarchiáról és a térközökről, mindegyikhez kerettel a képen. AI-értékelés, nem mérés.
Alternatív szövegek
Rövid képleírások képernyőolvasókhoz és keresőmotoroknak.

Minden eszköz →