색각 이상 시뮬레이터
다양한 색각 이상을 가진 사람들에게 색상이 어떻게 보이는지 확인하세요. 남성의 약 8%, 여성의 약 0.5%가 어떤 형태의 색각 이상을 가지고 있습니다.
#
텍스트 가독성 미리보기
색상 위 흰색 텍스트
정상 시각
색상 위 흰색 텍스트
제2색각이상 시뮬레이션
색각 이상에 대하여
적록 색각 이상
가장 흔한 유형으로, 남성의 약 8%에 영향을 미칩니다. 제1색각이상(적색 원추세포 없음)과 제2색각이상(녹색 원추세포 없음)을 포함합니다. 이 상태의 사람들은 빨간색과 녹색을 구분하는 데 어려움을 겪습니다.
청황 색각 이상
제3색각이상은 인구의 0.01% 미만에 영향을 미칩니다. 이 상태의 사람들은 파란색과 노란색을 구분하는 데 어려움을 겪습니다.
디자인 팁
정보 전달에 색상만 의존하지 마세요. 패턴, 레이블, 충분한 대비를 활용하세요. 이 시뮬레이터로 디자인을 테스트하여 접근성을 확보하세요.
자주 묻는 질문
Color vision deficiency affects approximately 8% of males and 0.5% of females of Northern European descent — roughly 300 million people worldwide. The most common type is deuteranomaly (reduced green sensitivity, ~5% of males), followed by protanomaly (reduced red sensitivity, ~1%). Total color blindness (achromatopsia) is extremely rare, affecting about 1 in 33,000 people.
Deuteranopia and protanopia (red-green color blindness) should be your top priority since they affect the largest population — combined, roughly 7-8% of males. If your design passes accessibility checks for deuteranopia, it will typically work for protanopia too, as both affect the red-green perception axis. Always also test tritanopia for designs that rely heavily on blue-yellow distinctions.
Never use color as the only way to convey information. Supplement color with patterns, icons, labels, or underlines. For charts and graphs, use distinct shapes or textures alongside colors. Maintain sufficient contrast ratios (WCAG AA minimum 4.5:1 for text). Avoid problematic combinations like red/green, green/brown, blue/purple, and green/gray. Use this simulator to verify your designs look clear under all types.
Red-green color blindness (protanopia and deuteranopia) affects the long and medium wavelength cones, making reds and greens appear similar — often as brownish or yellowish tones. Blue-yellow color blindness (tritanopia) affects the short wavelength cones, making blues appear greenish and yellows appear pinkish. Red-green is far more common (8% of males) than blue-yellow (less than 0.01% of the population).
This tool simulates individual colors rather than full images. To test how an entire image or illustration appears under color blindness, you can check each key color from your design. For full-image simulation, browser extensions like ChromeLens or built-in developer tools in Chrome (Rendering panel > Emulate vision deficiencies) can simulate color blindness on entire web pages.