구도를 바꾸지 않고 세부 비교
색각 시뮬레이터의 모든 보기는 같은 원본 Canvas를 사용합니다. 캐릭터 특징, 차트 표시, 레이블, 컨트롤, 배경이 같은 위치에 남아 약해진 구분을 구체적으로 찾기 쉽습니다.
이미지를 전송하지 않는 접근성 도구
이미지와 인터페이스를 위한 색각 시뮬레이터
색각 시뮬레이터로 일러스트, 인터페이스, 차트 또는 화면 캡처를 적색맹, 녹색맹, 청황색맹 미리 보기와 비교하세요. 이미지는 브라우저 안에 머물고 네 보기는 같은 구도를 유지하며, 내보낸 비교 파일에는 선택한 표시 강도가 기록됩니다.
2026년 7월 26일 업데이트
색각 시뮬레이터
이 색각 시뮬레이터는 무엇을 보여 주나요?
색각 시뮬레이터는 로컬 이미지의 픽셀에 공개 연구의 색각 이상 변환 행렬 세 가지를 적용합니다. 원본 옆에 적색맹, 녹색맹, 청황색맹 근사 보기를 배치하고, 원래 색인 0%부터 전체 행렬 결과인 100%까지 혼합할 수 있습니다. 색각 시뮬레이터는 색조만으로 구분한 요소가 약해지는 곳을 찾는 보조 도구입니다. 한 사람의 실제 지각을 재현하거나 색각을 진단하지 않으며, 인터페이스 접근성 준수를 인증하지도 않습니다.
색각 시뮬레이터
하나의 시각 문제를 정렬된 네 보기로 비교
색각 시뮬레이터는 모든 보기에서 자르기, 크기, 원본 픽셀을 같게 유지하므로 구도 변화가 아니라 색 관계에 집중할 수 있습니다.
비공개 작업을 브라우저 안에 유지
색각 시뮬레이터는 브라우저 API로 PNG, JPEG, WebP를 해석합니다. 이 도구에는 이미지 업로드 엔드포인트, 클라우드 보관함, 계정 또는 서버 처리 단계가 없습니다.
검토 근거 파일 내보내기
색각 시뮬레이터는 원본과 세 가지 근사 보기를 한 장에 담은 레이블이 있는 PNG를 만듭니다. 원본 파일과 분리해 접근성 검토 기록으로 첨부할 수 있습니다.
브라우저 안에서만 처리하는 이미지 비교
색각 시뮬레이터 사용하기
12MB 이하 PNG, JPEG 또는 WebP를 불러오세요. 색각 시뮬레이터는 이미지를 전송하지 않고 같은 구도의 Canvas 네 개를 만듭니다.
여기에 이미지 놓기
PNG, JPEG 또는 WebP · 최대 12MB · 붙여넣기도 지원
Toon Tone 예시 이미지정렬된 네 보기가 준비되었습니다.
이미지를 준비하고 있습니다…
이미지를 준비하고 있습니다…
이미지를 준비하고 있습니다…
이미지를 준비하고 있습니다…
색각 시뮬레이터
디자인 검토 과정에 미리 보기 포함하기
색각 시뮬레이터는 팔레트가 다르게 보인다는 막연한 느낌에서 멈추지 않고, 확인할 지점과 수정할 결정을 찾을 때 가장 유용합니다.
1. 실제 상태 불러오기
사용자가 보게 될 화면, 차트, 일러스트 또는 캐릭터 자세를 그대로 불러오세요. 고립된 색 견본을 색각 시뮬레이터에 넣는 것만으로는 실제 문맥에서 사라지는 레이블, 경계, 포커스 표시 또는 겹친 데이터 마크를 찾을 수 없습니다.
2. 세 모델 모두 비교하기
적색맹, 녹색맹, 청황색맹 카드를 살피며 분리하기 어려워지는 색 쌍을 찾습니다. 먼저 색각 시뮬레이터를 100%로 설정해 전체 행렬 결과를 보고, 강도를 낮추며 차이가 약해지기 시작하는 지점을 확인합니다.
3. 색 이외의 단서 추가하기
색각 시뮬레이터가 색조에만 의존한 구분을 드러내면 텍스트, 아이콘, 패턴, 윤곽선, 모양 또는 위치를 추가하세요. W3C의 색 사용 기준은 모든 근사 이미지를 같게 만들라는 뜻이 아니라 정보의 의미를 보존하라는 뜻입니다.
4. 구현된 인터페이스 다시 검사하기
수정한 실제 화면을 내보내 색각 시뮬레이터를 다시 실행하고, 색상 대비 검사기로 측정을 이어 가세요. 시뮬레이션, 대비, 키보드, 레이블, 당사자 테스트는 서로 다른 질문에 답합니다.
색각 시뮬레이터
각 미리 보기가 나타내는 모델
색각 시뮬레이터는 Machado, Oliveira, Fernandes 모델의 완전 이색형 행렬 세 가지를 사용합니다. 적록 계열과 청황 계열이라는 표현은 편리한 약칭일 뿐 개인의 지각을 완전히 설명하지 않습니다.
| 보기 | 모델 초점 | 일반적 분류 | 검토 질문 |
|---|---|---|---|
| 원본 | 변경하지 않은 sRGB 원본 픽셀 | 기준 보기 | 시뮬레이션 전에 의미를 전하는 차이는 무엇인가? |
| 적색맹 | 완전 protan 이색형 행렬 | 적록 계열 | 빨간색 중심 강조, 경고 또는 세부가 주변 색과 합쳐지는가? |
| 녹색맹 | 완전 deutan 이색형 행렬 | 적록 계열 | 녹색 상태, 차트 계열 또는 캐릭터 특징이 구별되는가? |
| 청황색맹 | 완전 tritan 이색형 행렬 | 청황 계열 | 파란색과 노란색 정보가 레이블 없이도 구별되는가? |
시뮬레이션과 대비가 답하는 질문이 다른 이유
색각 시뮬레이터는 선택한 모델에서 색 관계가 어떻게 달라질 수 있는지 근사합니다. 반면 대비 검사기는 전경과 배경 사이의 상대 휘도를 계산합니다. 레이블이 없는 차트 계열 두 개는 각각 배경과 충분한 대비를 가지면서도 서로 비슷해져 구분하기 어려울 수 있습니다. 반대 상황도 있습니다. 색각 시뮬레이터에서는 선명하게 다른 두 색이 밝은 배경의 글자색으로는 모두 기준을 통과하지 못할 수 있습니다. 각 도구는 실제로 측정하는 판단에 사용해야 합니다.
색각 시뮬레이터는 범주를 나타내는 색을 점검할 때 특히 유용합니다. 팀, 교통 노선, 게임 능력, 상태 점, 지도 영역, 데이터 계열은 전경과 배경의 비율보다 색조 차이에 의존하기 쉽습니다. 반드시 실제 화면을 검사하세요. 색각 시뮬레이터에서 두 범주가 가까워져도 작품 방향에 필요하다면 팔레트를 유지할 수 있습니다. 대신 직접 레이블, 마커 모양, 선 패턴, 아이콘 또는 공간 그룹을 더해 색이 정보를 전하는 유일한 수단이 되지 않도록 합니다.
Toon Tone은 색각 시뮬레이터를 색상 대비 검사기와 연결합니다. 완성된 검토에는 대개 두 도구가 모두 필요하기 때문입니다. 먼저 색각 시뮬레이터로 이미지 전체에서 구분이 약해질 가능성을 찾으세요. 그런 다음 전경과 배경의 조합에 의존하는 텍스트, 아이콘, 컨트롤, 필수 경계를 측정합니다. 어느 결과도 혼자서는 접근성 인증서가 아닙니다. 두 결과를 함께 기록하면 하나의 통과 수치를 제품 전체의 증명으로 잘못 사용하는 것보다 수정 이유를 더 잘 설명할 수 있습니다.
색각 시뮬레이터
반복 가능한 5단계 출시 전 확인
새 팔레트, 일러스트, 차트 또는 인터페이스 상태를 승인하기 전에 같은 색각 시뮬레이터 순서를 실행하세요.
- 01
색각 시뮬레이터: 레이블, 범례, 포커스 표시와 배경이 보이는 실제 제품 상태를 준비한다.
- 02
색각 시뮬레이터: 적색맹, 녹색맹, 청황색맹을 100%와 예정된 최소 표시 크기에서 검토한다.
- 03
색각 시뮬레이터: 색만으로 의미를 전하는 모든 구분을 찾아 텍스트, 모양, 패턴, 아이콘 또는 위치를 추가한다.
- 04
색각 시뮬레이터: 중요한 전경과 배경 쌍은 시뮬레이션으로 추측하지 말고 대비 검사기로 측정한다.
- 05
색각 시뮬레이터: 네 보기 PNG를 내보내 변경한 결정을 기록하고 구현 후 같은 검사를 반복한다.
색각 시뮬레이터
출처가 뒷받침하는 내용과 한계
색각 시뮬레이터는 행렬에 1차 연구를, 검토 방법에 공식 자료를 사용합니다. 수치는 집단, 표준, 모델 범위를 설명하며 한 사람의 정확한 경험을 예측하지 않습니다.
- 미국 National Eye Institute는 남성 약 12명 중 1명에게 색각 이상이 있다고 설명합니다. 이 공개 안내는 2026년 7월 26일 확인했습니다. 미국 National Eye Institute: 색각 이상
- 2021년 5월 16일 갱신된 Adobe 안내서는 전 세계 비율을 3–8%로 추정하고, 백인 인구 예시에서 여성 약 200명 중 1명이라는 값을 제시합니다. Adobe: 색상 접근성 도구
- Machado, Oliveira, Fernandes는 생리 기반 근사 모델을 2009년에 발표했습니다. 색각 시뮬레이터는 적색맹, 녹색맹, 청황색맹의 완전 행렬 세 개를 사용합니다. Machado 외(2009) 수정 논문
- WCAG 2.2 성공 기준 1.4.1은 레벨 A이며 색을 정보의 유일한 시각 수단으로 사용하지 않도록 요구합니다. 근사 보기는 위험을 찾지만 단독으로 준수 여부를 결정하지 않습니다. W3C: 성공 기준 1.4.1 색 사용 이해하기
W3C는 목표를 아홉 단어로 요약합니다.
Color is not the only way of distinguishing information.
색각 시뮬레이터 색상 접근성 검토 계속하기
색각 시뮬레이터
색각 시뮬레이터 질문
이 색각 시뮬레이터는 의료 검사인가요?
아닙니다. 색각 시뮬레이터는 디자인 검토를 위해 이미지 픽셀을 변환합니다. 사람을 검사하거나 정도를 측정하거나 진단하지 않습니다. National Eye Institute는 색각 검사를 위해 안과 전문가와 상담하도록 안내합니다.
좋은 결과가 접근성을 증명하나요?
아닙니다. 색각 시뮬레이터는 약해지는 색 구분을 찾지만 접근성에는 대비, 텍스트, 모양, 레이블, 키보드, 확대, 의미 구조, 사용자 테스트도 관여합니다. 결과는 하나의 검토 자료로 기록하세요.
왜 세 가지 근사 보기를 표시하나요?
적색맹과 녹색맹은 보통 적록 계열, 청황색맹은 청황 계열로 설명합니다. 같은 팔레트도 각 행렬에서 다르게 반응할 수 있으므로 색각 시뮬레이터는 세 가지를 모두 보여 줍니다.
강도 슬라이더는 무엇을 뜻하나요?
색각 시뮬레이터는 0%의 원래 선형화 sRGB 픽셀과 100%의 전체 행렬 결과를 혼합합니다. 중간값은 시각 비교를 위한 보조 수치이며 의학적 정도를 추정하지 않습니다.
불러온 이미지가 저장되나요?
색각 시뮬레이터는 지원 이미지를 현재 브라우저 탭에서 처리하며 업로드 엔드포인트가 없습니다. 새로 고치거나 닫으면 작업 Canvas가 사라집니다. 내려받은 PNG는 사용자가 저장한 위치에 남습니다.