16진법, RGB 혹은 CSS 컬러 키워드 형태로 된 색의 값을 입력하실 수 있습니다. 보기: #FFFFFF, rgb(255,255,255) 혹은 white

도움말

본문 글자 색

본문에 쓰인 글자에 입히는 입니다. 이 항목에는 CSS 컬러 키워드, 16진법, 혹은 RGB 값을 입력하실 수 있습니다. 실제 변환된 색은 항목 오른쪽에서 미리 확인하실 수 있습니다.

컬러 키워드

보기: Black, Silver, YellowGreen, MediumPurple.
여기에 사용될 수 있는 값은 CSS 컬러 키워드 문서에 나열되어 있습니다. (CSS level 1부터 CSS level 4까지).

16진법 형태의 컬러 값

보기: #AABBCC. 참고로 #ABC처럼 간략한 형태로 입력하셔도 되고, 해당 항목은 자동으로 #AABBCC로 변환됩니다. 또, 여기엔 # 글자를 생략하고 입력하셔도 돼서, FFF 혹은 FFFFFF 모두 혼용해서 입력하실 수 있습니다. 

RGB 형태의 컬러 값

보기: rgb(255,255,255).
마찮가지로 255,255,255처럼 짧은 용법으로 입력하실 수 있으며, 그러면 rgb(255,255,255)로 해석됩니다.

배경색

배경에 칠해지는 색입니다.
이 항목은 앞의 본문 글자 항목과 같은 원리로 작동합니다.

최소 비율

세 가지 선택가능한 값으로 3, 4.5 그리고 7이 있습니다.

비율은 어떻게 정할까요? 다음의 요소에 따라 결정됩니다:

레벨 AA

두 가지 요소(크기와 볼드 유무)에 따라 다음과 같은 네 가지 조합을 도출할 수 있습니다:

레벨 AAA

레벨 AAA의 원리는 같으나, 비율만 다음과 같이 증가합니다:

글자 크기의 이해

글자 크기를 해석하는 방식에 관해서 더 깊고 자세히 알고 싶으시면, WCAG에 기술된 large-scale text의 정의를 읽어보십시오.

대비 비율에 관한 자세한 설명

교정하려는 색

본문 글자 색 또는 배경색을 선택하실 수 있습니다. 기본은 본문 글자 색.

선택하신 색은 나중에 기준에 적합한 색을 찾을 때까지 수정되며, 나머지 색은 변하지 않습니다.

알고리듬

“처음 지정한 색과 아주 비슷하면서도 기준에 적합한 대비 색”

이것이 기본으로 쓰이는 알고리듬입니다. 처음 지정한 색과 아주 가까운 색만 골라서 보여줍니다. (색의 편차는 수학적 방식으로 산출되며, 디자이너의 관점과는 다를 수 있습니다.)

몇몇 색 조합에 따라선, 알고리듬은 아무런 결과도 추출하지 못할 수도 있습니다 ; 이 경우엔, 다른 알고리듬을 사용해 보십시오.

“확장된 색 범위 속 기준에 적합한 대비 색”

차선책으로 쓰이는 알고리듬으로, 첫 번째 것이 아무런 결과도 보여주지 않을 때 사용합니다. 하지만, 산출되는 색은 최초 지정 색과 (많이) 다를 수 있습니다.

사용자 건의

Contrast-Finder를 사용하시면서 문제가 있거나 다른 문의 사항이 있으시면, 연락해주시기 바랍니다:

Contrast-Finder의 기능 개선 및 제안

어떠한 제안이든 모두 환영합니다! 번역, 문제 수정, 오류 보고, 새로운 기능…
부담없이 소스 코드를 가지고 놀아보시고, 포럼에서도 상의해 보세요.