색상 코드 변환 — 대비 계산까지 같은 화면에서

색을 바꾸는 것은 산수이고, 그것만 해 주고 끝나는 페이지가 대부분입니다. 정작 필요한 숫자는 대개 그다음에 있습니다 — 이 색 위에 글자가 읽히는가.

이 페이지는 둘을 같이 합니다. HEX·RGB·HSL이 어느 쪽으로든 편집되고, 그와 동시에 대비가 계산됩니다. 흰 바탕에 대해, 검은 바탕에 대해, 그리고 지정한 두 번째 색에 대해. 색이 무드보드가 아니라 실제 화면에 들어갈 때 나오는 질문이 이 셋입니다.

한 가지는 일부러 못 박아 두었습니다. CMYK를 내되 근사치라고 적습니다. 브라우저에는 인쇄기도 종이도 프로파일도 없기 때문입니다. 정확한 CMYK를 건네는 페이지는 공식을 건네면서 일치라고 부르는 것입니다.

계산은 전부 여기서 끝납니다. 입력한 값은 전송되지 않고 탭을 닫으면 사라집니다.

1. 이미 갖고 있는 값을 그 칸에 치세요. 디자인 파일의 HEX든, 캡처 도구의 RGB든, 손으로 조정 중인 HSL이든 나머지 둘이 바로 따라옵니다.
2. 변환이 아니라 고르는 중이라면 색 선택기를 쓰세요. 같은 칸에 값이 들어가므로 다른 표기도 함께 맞춰집니다.
3. 복사하기 전에 견본 두 개를 보세요. 지금 만드는 화면에서 괜찮아 보이는 색이, 반대 바탕에서 무너지는 그 색인 경우가 많습니다.
4. 실제로 쓸 조합으로 두 번째 색을 지정하세요. 흰 바탕이 아니라 진짜 배경색과의 비율이 접근성 검사가 보는 값입니다.
5. 기준선에 살짝 못 미치면 색상이 아니라 명도를 움직이세요. 대개 L을 몇 점 옮기는 것만으로 고른 색을 바꾸지 않고 넘어갑니다.