Farbenblindheit simulieren: Protanopie, Deuteranopie, Tritanopie
Prüfen Sie, wie eine Farbe bei Protanopie, Deuteranopie oder Tritanopie erscheinen kann: #3A86FF wird bei Deuteranopie zu #5751DB. Kontrollieren Sie Statusfarben und Diagrammreihen, bevor zwei davon verschmelzen. Kostenlos in Ihrem Browser.
- Kostenlos
- Läuft in Ihrem Browser
- Ohne Anmeldung
- Ihre Daten bleiben auf Ihrem Gerät
Im Browser ausführen – kostenlos
Rechenbeispiel
- Farbe
- #3A86FF
- Typ
- Deuteranopia
- Simulierte Farbe
- #5751DB
Dieser Farbenblindheits-Simulator wandelt eine hexadezimale sRGB-Farbe mit einer festen Standardmatrix für Protanopie, Deuteranopie oder Tritanopie um. Sie erhalten die normalisierte Ausgangsfarbe, den gewählten Sehschwächentyp, die simulierte Hexadezimalfarbe sowie deren Rot-, Grün- und Blauwerte. Das Ergebnis ist eine praktische Näherung für frühe Designprüfungen, Palettenvergleiche, Dokumentationen und automatisierte Qualitätssicherungen. Es stellt weder eine Diagnose noch die genaue Wahrnehmung jeder Person dar, macht aber potenziell missverständliche Farbverschiebungen sichtbar, bevor ein Entwurf seine Nutzerinnen und Nutzer erreicht.
Wählen Sie Ausgangsfarbe und Simulationstyp
Beginnen Sie mit einer Farbe als hexadezimalem sRGB-Wert. Zulässig sind die kurze dreistellige Form wie #F80 und die vollständige sechsstellige Form wie #FF8800. Wählen Sie anschließend Protanopie, Deuteranopie oder Tritanopie.
Protanopie bildet die fehlende funktionale Reaktion langwellenempfindlicher Zapfen ab und verändert häufig Beziehungen mit Rot. Deuteranopie bildet die fehlende funktionale Reaktion mittelwellenempfindlicher Zapfen ab und beeinträchtigt meist Unterscheidungen mit Grün. Tritanopie bildet die fehlende funktionale Reaktion kurzwellenempfindlicher Zapfen ab und kann Blau-Gelb-Beziehungen verändern.
Der Dienst weist jeden anderen Typ zurück, statt stillschweigend zu raten. Dadurch bleiben Stapeltests und Prüfungen von Designsystemen verlässlich. Ebenfalls abgelehnt werden Farbnamen, Werte ohne Raute, Alphakanäle und fehlerhafte Hexadezimalzeichenfolgen.
Der zurückgegebene Ausgangswert wird auf sechs Stellen erweitert und in Großbuchstaben normalisiert, sodass er sich direkt mit dem Simulationsergebnis vergleichen lässt.
Verstehen Sie die Berechnung der Näherung
Zunächst wandelt der Simulator den Hexadezimaltext in drei ganzzahlige sRGB-Kanäle zwischen null und 255 um. Danach wählt er die feste 3-mal-3-Matrix für den angeforderten Farbenblindheitstyp. Jeder Ausgabekanal entsteht als gewichtete Summe der ursprünglichen Rot-, Grün- und Blaukanäle.
Die berechneten Werte werden auf die nächste ganze Zahl gerundet, auf den gültigen Kanalbereich begrenzt und als sechsstellige Hexadezimalfarbe formatiert. Diese Matrixnäherung ist deterministisch: Gleiche Eingaben liefern immer gleiche Ausgaben, ohne Netzwerkanfrage, Zufallsauswahl, Benutzerprofil oder geräteabhängigen Zustand. Diese Beständigkeit eignet sich für reproduzierbare Audits und Snapshot-Tests.
Ein einzelnes simuliertes Farbfeld ist dennoch kein vollständiges Urteil über Barrierefreiheit. Tatsächliches Farbsehen und Bildschirmkalibrierung unterscheiden sich, außerdem beeinflussen umgebende Farben die Wahrnehmung. Verwenden Sie die Umwandlung, um wahrscheinliche Verschiebungen und Verwechslungen zu erkennen.
Ergänzen Sie sie vor einer endgültigen Entscheidung durch Kontrastmessungen, nichtfarbliche Hinweise, Beschriftungen, Muster und Tests sämtlicher Oberflächenzustände.
Nutzen Sie das Ergebnis im barrierefreien Designprozess
Vergleichen Sie die zurückgegebene simulierte Farbe mit weiteren umgewandelten Farben derselben Palette, insbesondere wenn diese Status, Auswahl, Validierung oder Diagrammkategorien vermitteln. Zwei Ausgangsfarben, die deutlich verschieden wirken, können bei einer Simulation näher zusammenrücken. Sind sie schwer unterscheidbar, ändern Sie Farbton, Helligkeit, Sättigung, Rahmen, Symbole, Text oder Muster, anstatt sich ausschließlich auf Farbe zu verlassen.
Für automatisierte Abläufe rufen Sie den Dienst für jeden Paletteneintrag und jeden unterstützten Typ einmal auf und speichern die normalisierten Hexadezimal- und RGB-Werte neben den ursprünglichen Tokens. Die stabile Ausgabe vereinfacht Regressionsprüfungen nach Änderungen am Designsystem. Beachten Sie, dass diese Fähigkeit eine Farbumwandlung bewertet, nicht den Kontrast zwischen Vorder- und Hintergrund und auch keine vollständig gerenderte Seite.
Eine belastbare Prüfung kombiniert die Simulation mit Kontrastkontrollen und nutzerzentrierten Gebrauchstests. Dokumentieren Sie den verwendeten Matrixtyp, damit Ihr Team das Ergebnis reproduzieren und eine Palettenänderung nachvollziehen kann.
Anwendungsfälle
Tokens eines Designsystems prüfen
Wandeln Sie semantische Palettenfarben mit allen drei unterstützten Typen um, bevor Sie eine neue Token-Version freigeben.
Diagrammkategorien kontrollieren
Vergleichen Sie simulierte Reihenfarben und ergänzen Sie Beschriftungen, Markierungen oder Muster, wenn der Farbton nicht genügt.
Häufige Fragen
Welche Arten von Farbenblindheit werden unterstützt?
Unterstützt werden Protanopie, Deuteranopie und Tritanopie. Ein unbekannter Typ führt zu einem Fehler wegen ungültiger Eingabe.
Welche Farbformate kann ich eingeben?
Verwenden Sie hexadezimales sRGB im Format #RGB oder #RRGGBB. Farbnamen und Werte mit Alphakanal werden nicht akzeptiert.
Ist dies eine medizinische Diagnose oder eine exakte Wahrnehmung?
Nein. Es handelt sich um eine Matrixnäherung zur Designanalyse, nicht um ein Diagnosewerkzeug oder ein exaktes Modell individuellen Sehens.
Beweist eine simulierte Farbe die Barrierefreiheit eines Designs?
Nein. Prüfen Sie auch den Kontrast, bieten Sie Hinweise jenseits von Farbe, untersuchen Sie vollständige Oberflächenzustände und führen Sie geeignete Nutzertests durch.
Wie sieht #3A86FF bei Deuteranopie aus?
Der Simulator liefert #5751DB mit Rot 87, Grün 81 und Blau 219. Prüfen Sie die übrigen Farben Ihrer Palette mit derselben Art und vergleichen Sie: Rücken zwei eng zusammen, braucht es ein weiteres Merkmal wie Beschriftung oder Muster.
Verwandte Tools
Für Entwickler — API-Zugang
Alles auf dieser Seite ist auch per API verfügbar. Dieser Abschnitt richtet sich an Teams, die es in ihre eigenen Systeme einbinden möchten; alle anderen nutzen einfach das Tool oben.
Endpunkt
Authentifizierung per Bearer-Token. Ein einziger POST stellt die Aufgabe in die Warteschlange; das Ergebnis erhalten Sie per Webhook oder über einen signierten Link.
Aufruf aus Ihrem Stack
curl -X POST https://api.kit.forhosting.com/color/blindness-simulate \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"color":"#3A86FF","type":"deuteranopia"}'const res = await fetch("https://api.kit.forhosting.com/color/blindness-simulate", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"color": "#3A86FF",
"type": "deuteranopia"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/blindness-simulate",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"color": "#3A86FF",
"type": "deuteranopia"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/blindness-simulate", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"color":"#3A86FF","type":"deuteranopia"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"color":"#3A86FF","type":"deuteranopia"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/blindness-simulate", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Beispiel-Anfrage
{
"color": "#3A86FF",
"type": "deuteranopia"
}Beispiel-Antwort
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.blindness_simulate",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}Die API arbeitet asynchron: Sie erhalten sofort eine task_id. Polling ist mit 1 Anfrage pro Sekunde erlaubt.
Preis
Der Preis steht auf der Seite – keine Tokens, keine Credits. Fehlgeschlagene Aufgaben werden nicht berechnet.
Fehler
| HTTP | Code | Bedeutung |
|---|---|---|
401 | unauthorized | Der API-Schlüssel fehlt oder ist ungültig – prüfen Sie den Authorization-Header (Bearer). |
402 | insufficient_balance | Ihr Guthaben reicht für diese Aufgabe nicht aus – Aufladungen verfallen nicht. |
404 | unknown_type | Unbekannter Aufgabentyp – prüfen Sie das Feld „type“ gegen den Katalog. |
429 | rate_limited | Zu viele Anfragen – warten Sie kurz; Polling ist mit 1 Anfrage pro Sekunde erlaubt. |
Technische Hinweise
Wählen Sie Ausgangsfarbe und Simulationstyp
Das bewusst enge Eingabeformat sorgt dafür, dass dieselbe Eingabe in einem Browserformular, einer API-Anfrage, einer Testsuite oder einer Build-Pipeline identisch verarbeitet wird.
Nutzen Sie das Ergebnis im barrierefreien Designprozess
Der API-Preis beträgt $0.002 pro Element; die Browseranwendung eignet sich für schnelle Einzelprüfungen.
Integrationsbeispiele
Regressionstests für Paletten automatisieren
Erzeugen Sie beim Build stabile Umwandlungswerte, damit Prüfende Barrierefreiheitsprobleme nach Farbänderungen erkennen.
Technische Fragen
Was kostet eine Simulation per API?
Jedes Element kostet $0.002. Die Berechnung ist deterministisch und kontaktiert keinen externen Dienst.