색상 코드 변환과 명도 대비
같은 색을 HEX(#RRGGBB), RGB(빛의 삼원색 값), HSL(색상·채도·명도)로 서로 바꿔 보여주고, 밝기를 단계별로 조절한 팔레트를 만들어 줍니다. 디자인·CSS 작업이나 브랜드 색 정리에 유용합니다.
WCAG 명도 대비란?
글자색과 배경색의 밝기 차이를 대비비로 나타낸 값입니다. 웹 접근성 지침(WCAG)은 일반 텍스트에 4.5:1(AA) 이상, 큰 텍스트에 3:1 이상을 권장합니다. 대비가 낮으면 글자가 잘 안 보이니, 배너·상세페이지 글자색을 정할 때 확인하세요.
대비비는 WCAG 상대휘도 공식으로 계산합니다. 모든 계산은 브라우저에서만 이뤄집니다.
대비비: WCAG 2.x 상대휘도((L1+0.05)/(L2+0.05)) 기준.
자주 묻는 질문 (FAQ)
HEX·RGB·HSL은 뭐가 다른가요?
같은 색을 다르게 표기한 것입니다. HEX는 웹에서 흔한 16진수, RGB는 빨강·초록·파랑 값, HSL은 색상·채도·명도라 밝기·채도 조절이 직관적입니다.
대비비 4.5:1은 어떤 의미인가요?
글자와 배경의 밝기 차이가 4.5배라는 뜻으로, 일반 텍스트가 읽기 편한 최소 기준(WCAG AA)입니다. 큰 글자는 3:1이면 됩니다.
팔레트는 어떻게 쓰나요?
선택한 색을 기준으로 더 밝은/어두운 단계를 보여줍니다. 버튼 호버색, 배경 톤 등 같은 계열 색을 고를 때 쓰세요.