색맹 시뮬레이터이란?

색맹 시뮬레이터는 다양한 색각 이상을 가진 사람들의 눈에 이미지와 색상 팔레트가 어떻게 보이는지 보여줍니다. 적색맹, 녹색맹, 청색맹, 전색맹을 테스트하여 각 경우에 구분되지 않는 색을 찾아보세요.

시뮬레이터는 모든 픽셀을 Brettel과 Machado 모델 기반의 색각 결손 매트릭스에 통과시켜 여덟 가지 대표 유형이 보는 모습을 근사합니다. '전부 비교' 모드는 원본과 모든 유형을 나란히 보여 주어, UI 시안이나 차트를 점검할 때 일일이 전환하는 것보다 훨씬 빠릅니다.

사용 방법

1. 접근성을 테스트할 이미지를 업로드하거나 색상을 입력하세요.
2. 색각 유형을 고르고 구분선을 좌우로 끌면 원본과 시뮬레이션을 자연스럽게 비교할 수 있습니다. 가벼운 색약은 강도 슬라이더로 조절하세요.
3. 모든 시민레이션 유형을 한 번에 비교하고 문서화를 위해 시민레이션된 이미지를 다운로드하세요.

사용 시기

• UX 리뷰 전에 대시보드의 상태 배지 색을 점검할 때.
• 차트에서 빨강/녹색 강조가 여전히 구분되는지 확인할 때.
• 독자 범위가 넓은 공개 보고서의 차트 팔레트를 고를 때.

결과

UI 디자이너가 앱 대시보드 스크린샷을 업로드하여 빨강과 초록 상태 표시기가 녹색맹에서 구별 불가능하다는 것을 발견했습니다. 색상과 함께 아이콘 형태도 추가하여 문제를 해결했습니다.

자주 묻는 질문

실제 색각 결손자의 시야와 얼마나 비슷한가요?

Brettel과 Machado 매트릭스는 쓸 만한 근사일 뿐, 완벽한 일치는 아닙니다. 실제 인식은 조명과 개인차에도 영향을 받으니, 눈에 띄는 문제를 찾는 용도로 쓰고 의료 자료로 삼지는 마세요.

Protanopia와 protanomaly의 차이는 무엇인가요?

Protanopia는 적색 원추세포가 완전히 없어서 빨강이 크게 어두워집니다. Protanomaly는 적색 반응이 약해진 상태라 비슷해 보이지만 변화 폭이 작습니다. 녹색(deutera)과 파랑(trita)에도 같은 식의 '전색맹'과 '색약'이 있습니다.

디자인에서 어떤 유형을 우선 고려해야 하나요?

Deuteranomaly(녹색 약)는 남성의 약 5%에서 나타나 적녹색 결손 중 가장 흔합니다. Protanopia와 deuteranopia를 합치면 약 2%이고, 파랑 결손과 완전색맹은 드뭅니다. 넓은 접근성을 위해서는 녹색 약을 먼저 챙기세요.

이미지를 올리지 않고 개별 색상을 확인할 수 있나요?

네. 색상 탭으로 전환해 원하는 16진수 코드를 입력하면 일곱 가지 시각 유형이 그 색을 어떻게 보는지 나란히 표시되어, 스크린샷 없이 브랜드 팔레트나 UI 토큰을 점검할 수 있습니다. 전체 이미지의 경우 색 보정 버튼이 한 걸음 더 나아가, 색각 이상이 있는 사람도 색조를 실제로 구분할 수 있도록 이미지를 다시 칠합니다.

업로드한 이미지가 서버로 전송되나요?

아니요. 이미지는 브라우저 탭 안의 캔버스에서 디코드되고, 매트릭스는 로컬에서 적용되며, 결과는 그 자리에서 그려집니다. 페이지 밖으로 나가는 데이터는 없으며 탭을 닫으면 전부 사라집니다.

관련 도구