색맹 시뮬레이터

이미지를 색각이상별로 시뮬레이션해 접근성을 점검합니다.

이미지를 선택하거나 끌어다 놓으세요

디자인의 색 접근성을 점검할 때 사용하세요. 근사 시뮬레이션이며 실제 인지와 차이가 있을 수 있습니다.

발표 자료의 꺾은선 그래프를 빨강과 초록으로 구분해 두었다면, 어떤 사람에게는 두 선이 거의 같은 색으로 보일 수 있습니다. 색각이상은 결코 드문 특성이 아니어서, 색만으로 정보를 구분한 화면은 그만큼 읽히지 않게 됩니다.

이 도구는 이미지를 올리면 색각이상 유형별로 어떻게 보이는지 바로 바꿔 보여 줍니다. 이미지는 브라우저 안에서만 처리되고 서버로 올라가지 않습니다.

어떻게 계산되나요

어떻게 변환되나요

이미지를 올리면 캔버스에 그린 뒤 픽셀 하나하나의 R·G·B 값에 유형별 변환 행렬을 곱해 새 색을 만듭니다. 예를 들어 전색맹(흑백)은 널리 쓰이는 휘도 공식 0.299R + 0.587G + 0.114B 를 세 채널에 모두 적용해 밝기만 남깁니다. 적·녹·청색맹은 해당 원추세포가 받아들이는 신호가 다른 채널로 섞이는 것을 근사한 계수를 씁니다.

유형별로 무엇이 달라지나요

유형	구분이 흐려지기 쉬운 조합
적색맹 (Protanopia)	빨강–초록, 빨강이 어둡게
녹색맹 (Deuteranopia)	초록–빨강, 갈색–연두
청색맹 (Tritanopia)	파랑–초록, 노랑–분홍
전색맹 (Achromatopsia)	모든 색상, 밝기 차이만 남음

사용 순서

이미지를 끌어다 놓거나 이미지 선택으로 파일을 고릅니다.
유형 목록에서 보고 싶은 색각이상을 고르면 미리보기가 즉시 바뀝니다.
다운로드를 누르면 변환 결과가 PNG로 저장됩니다.

정상과 각 유형을 번갈아 보면서, 유형을 바꿨을 때 서로 붙어 버리는 요소가 있는지 확인하면 됩니다. 붙는 항목이 있다면 색을 바꾸기보다 명도 차이·패턴·라벨·아이콘을 함께 쓰는 편이 확실합니다.

이 결과는 디자인 점검용 근사 시뮬레이션이며 색각 검사가 아닙니다. 본인의 색각이 궁금하다면 안과 전문의의 검사를 받아 보세요.

용어 정리

색각이상: 특정 색을 구분하기 어려운 시각 특성. 흔히 '색맹'으로 부르지만 색을 전혀 못 보는 경우는 드뭅니다.
적색맹 (Protanopia): 빨강을 느끼는 원추세포가 기능하지 않아 빨강과 초록이 비슷해지고 빨강이 어둡게 보입니다.
녹색맹 (Deuteranopia): 초록을 느끼는 원추세포 쪽 이상으로, 색각이상 중 가장 흔한 유형으로 알려져 있습니다.
청색맹 (Tritanopia): 파랑–노랑 계열 구분이 어려운 유형으로 상대적으로 드뭅니다.
전색맹 (흑백): 색상 정보 없이 밝기만 인지하는 상태. 명도 대비만으로 구분되는지 확인할 때 유용합니다.
명도 대비: 두 색의 밝기 차이. 색상이 사라져도 남는 정보라 접근성의 핵심 지표입니다.

자주 묻는 질문

이미지가 서버에 올라가나요?

올라가지 않습니다. 파일 읽기와 색 변환이 모두 브라우저 안에서 이뤄지며, 결과 PNG도 브라우저가 만들어 바로 저장합니다. 인터넷 연결이 끊긴 상태에서도 페이지만 열려 있으면 동작합니다.

이 시뮬레이션이 실제로 보이는 모습과 같나요?

같지는 않습니다. 색각이상은 정도가 사람마다 다르고, 여기서 쓰는 변환 행렬은 전형적인 유형을 근사한 값입니다. '이 조합은 구분이 어려워질 수 있다'를 확인하는 용도로 보시면 됩니다.

색이 붙어 보이면 어떻게 고치나요?

색상만 바꾸는 대신 밝기 차이를 벌리고, 선 모양(실선·점선)이나 패턴·아이콘·직접 라벨링을 함께 쓰는 것이 안전합니다. 전색맹(흑백)으로 바꿨을 때도 구분되면 대체로 무난합니다.

그래프 말고 어떤 걸 점검하면 좋나요?

필수 입력 오류를 빨간 테두리로만 표시한 폼, 색으로만 상태를 나타내는 배지·범례, 빨강/초록 버튼 쌍, 지도 범례 등이 대표적입니다.

결과 파일 형식은 무엇인가요?

PNG로 저장됩니다. 원본 크기 그대로 변환되며, 투명 배경이 있는 이미지는 투명도가 유지됩니다.