Simulatore di daltonismo per protanopia, deuteranopia e tritanopia
Verifichi come può apparire un colore con protanopia, deuteranopia o tritanopia: #3A86FF con deuteranopia diventa #5751DB. Controlli i colori di stato e le serie dei grafici prima che due di essi si confondano. Gratis nel Suo browser.
- Gratis
- Funziona nel suo browser
- Senza registrazione
- I suoi dati restano sul dispositivo
Esegui gratis nel browser
Esempio risolto
- Colore
- #3A86FF
- Tipo
- Deuteranopia
- Colore simulato
- #5751DB
Questo simulatore di daltonismo trasforma un colore sRGB esadecimale mediante una matrice standard fissa per protanopia, deuteranopia o tritanopia. Restituisce il colore sorgente normalizzato, il tipo di visione selezionato, il colore esadecimale simulato e i valori dei suoi canali rosso, verde e blu. Il risultato è un'approssimazione pratica per verifiche iniziali del design, confronti tra palette, documentazione e flussi automatizzati di controllo qualità. Non diagnostica la vista e non riproduce la percezione di ogni persona, ma rende visibili variazioni cromatiche potenzialmente ambigue prima che un progetto raggiunga gli utenti.
Scelga il colore sorgente e il tipo di simulazione
Inizi con un colore espresso come valore sRGB esadecimale, usando la forma compatta a tre cifre, come #F80, oppure quella completa a sei cifre, come #FF8800. Selezioni quindi protanopia, deuteranopia o tritanopia. La protanopia rappresenta l'assenza di una risposta funzionale dei coni sensibili alle lunghezze d'onda lunghe e spesso modifica le relazioni che coinvolgono il rosso.
La deuteranopia rappresenta l'assenza di una risposta funzionale dei coni sensibili alle lunghezze d'onda medie e normalmente influenza le distinzioni legate al verde. La tritanopia rappresenta l'assenza di una risposta funzionale dei coni sensibili alle lunghezze d'onda corte e può alterare le relazioni tra blu e giallo. Il servizio rifiuta qualsiasi altro tipo senza formulare ipotesi silenziose, mantenendo affidabili i test in serie e i controlli sui sistemi di design.
Rifiuta anche nomi di colori, valori senza cancelletto, canali alfa e stringhe esadecimali non valide. Il valore sorgente restituito viene espanso e normalizzato in maiuscolo per agevolare il confronto.
Comprenda come viene calcolata l'approssimazione
Il simulatore converte innanzitutto il testo esadecimale in tre canali sRGB interi compresi tra zero e 255. Poi seleziona la matrice fissa 3 per 3 associata al tipo di daltonismo richiesto. Ogni canale in uscita è la somma ponderata dei canali rosso, verde e blu originali.
I valori calcolati vengono arrotondati all'intero più vicino, limitati all'intervallo valido del canale e formattati come colore esadecimale a sei cifre. È un'approssimazione matriciale deterministica: input identici producono sempre output identici, senza richieste di rete, scelte casuali, profili utente o stato dipendente dal dispositivo. Tale coerenza è utile per audit ripetibili e test delle istantanee.
Tuttavia, un singolo campione simulato non costituisce un giudizio completo sull'accessibilità. La visione cromatica reale varia, così come la calibrazione degli schermi, e i colori circostanti influenzano la percezione. Utilizzi la trasformazione per rilevare probabili variazioni e sovrapposizioni.
La combini con misurazioni del contrasto, segnali non cromatici, etichette, motivi e test di tutti gli stati dell'interfaccia prima di prendere una decisione definitiva.
Usi il risultato in un flusso di design accessibile
Confronti il colore simulato restituito con altri colori trasformati della stessa palette, soprattutto quelli che comunicano stato, selezione, convalida o categorie di grafici. Due colori sorgente apparentemente molto diversi possono diventare più simili con una determinata simulazione. Se risultano difficili da distinguere, modifichi tonalità, luminosità, saturazione, bordi, icone, testo o motivi anziché affidarsi soltanto al colore.
Per automatizzare il lavoro, richiami il servizio una volta per ogni elemento della palette e per ogni tipo supportato, quindi archivi i valori esadecimali e RGB normalizzati insieme ai token originali. L'output stabile semplifica le revisioni di regressione quando cambia un sistema di design. Ricordi che questa capacità valuta una trasformazione del colore, non il contrasto fra primo piano e sfondo né un'intera pagina renderizzata.
Una revisione solida abbina la simulazione a controlli del contrasto e test di usabilità incentrati sulle persone. Documenti il tipo di matrice usato affinché il team possa riprodurre il risultato e comprenderne le motivazioni.
Casi d'uso
Verifichi i token del sistema di design
Trasformi i colori semantici della palette con tutti e tre i tipi supportati prima di approvare una nuova versione dei token.
Controlli le categorie dei grafici
Confronti i colori simulati delle serie e aggiunga etichette, indicatori o motivi quando la tonalità da sola non basta.
Domande frequenti
Quali tipi di daltonismo sono supportati?
Sono supportate protanopia, deuteranopia e tritanopia. Qualsiasi tipo non riconosciuto restituisce un errore di input non valido.
Quali formati di colore posso fornire?
Utilizzi sRGB esadecimale nel formato #RGB o #RRGGBB. I nomi dei colori e i valori con canale alfa non sono accettati.
È una diagnosi medica o una rappresentazione esatta della percezione?
No. È un'approssimazione matriciale per l'analisi del design, non uno strumento diagnostico né un modello esatto della vista individuale.
Un colore simulato dimostra che un design è accessibile?
No. Verifichi anche il contrasto, fornisca segnali oltre al colore, esamini gli stati completi dell'interfaccia ed esegua test adeguati con utenti.
Come appare #3A86FF con la deuteranopia?
Il simulatore restituisce #5751DB, con rosso 87, verde 81 e blu 219. Passi gli altri colori della Sua palette con lo stesso tipo e li confronti: se due risultano troppo vicini, aggiunga un altro segnale, come un’etichetta o un motivo.
Strumenti correlati
Per sviluppatori — accesso via API
Tutto quello che vedi in questa pagina è disponibile anche via API. Questa sezione è per i team che vogliono integrarlo nei propri sistemi; chi non ne ha bisogno può semplicemente usare lo strumento qui sopra.
Endpoint
Autenticazione con Bearer token: un POST mette in coda l'attività e il risultato arriva via webhook o link firmato.
Chiamala dal tuo 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)Esempio di richiesta
{
"color": "#3A86FF",
"type": "deuteranopia"
}Esempio di risposta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.blindness_simulate",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}L'API è asincrona: ricevi subito un task_id e puoi fare polling fino a 1 richiesta al secondo.
Prezzi
Prezzo pubblicato, senza token né crediti. Se l'attività fallisce, non paghi.
Errori
| HTTP | Codice | Significato |
|---|---|---|
401 | unauthorized | Chiave API mancante o non valida: controlla l'header Authorization. |
402 | insufficient_balance | Credito esaurito: ricarica per continuare a eseguire attività. |
404 | unknown_type | Tipo di attività sconosciuto: controlla il campo type della richiesta. |
429 | rate_limited | Troppe richieste in poco tempo: rallenta e riprova tra qualche secondo. |
Note tecniche
Scelga il colore sorgente e il tipo di simulazione
Un formato rigoroso assicura che lo stesso input si comporti allo stesso modo in un modulo, tramite API, in una suite di test o in una pipeline di compilazione.
Usi il risultato in un flusso di design accessibile
Il prezzo dell'API è $0.002 per elemento, mentre l'esperienza nel browser è adatta a rapide verifiche individuali.
Casi di integrazione
Automatizzi i test di regressione della palette
Generi valori trasformati stabili durante la compilazione per individuare regressioni di accessibilità dopo modifiche cromatiche.
Domande tecniche
Quanto costa una simulazione tramite API?
Ogni elemento costa $0.002. Il calcolo è deterministico e non contatta servizi esterni.