색상 코드 변환
디자인 시안의 HEX 코드를 RGB로, 인쇄용 CMYK로. 아무 형식이나 넣으면 모든 형식으로 바꿔 주고, 밝고 어두운 단계까지 만들어 드려요.
#hex, rgb(), hsl(), 색 이름(tomato) 모두 돼요
밝기 단계 (클릭해서 복사)
글자 대비 (WCAG)
이 도구는 브라우저 안에서만 작동해요. 넣은 파일과 글은 어떤 서버에도 올라가지 않아요.
마지막 점검: · 만든 곳 손끝공방
이렇게 쓰세요
- 1
입력칸에
#d4553a,rgb(212,85,58),tomato처럼 아무 형식이나 넣거나, 왼쪽 색 상자를 눌러 고르세요. - 2
모든 형식의 코드가 아래에 나와요. 오른쪽 버튼으로 복사하세요.
- 3
오른쪽에서 밝기 단계와 흰 글자·검은 글자 대비 등급을 확인하세요.
색상 코드 형식 정리
| 형식 | 예시 | 쓰는 곳 |
|---|---|---|
| HEX | #D4553A | 웹, 피그마, 대부분의 디자인 도구 |
| RGB | rgb(212, 85, 58) | CSS, 화면 디자인, 파워포인트 |
| HSL | hsl(11, 64%, 53%) | CSS에서 밝기·채도를 조절할 때 |
| CMYK | cmyk(0%, 60%, 73%, 17%) | 인쇄물 |
CMYK 값은 단순 계산식으로 바꾼 참고값이에요. 실제 인쇄 색은 종이와 인쇄기에 따라 달라지므로, 중요한 인쇄물은 인쇄소의 색 프로파일로 확인하세요.
글자 대비(WCAG)는 왜 중요할까요?
배경과 글자 색의 밝기 차이가 작으면 눈이 나쁜 분이나 햇빛 아래에서 휴대폰을 보는 사람이 글을 읽기 어려워요. 웹 접근성 기준(WCAG 2.1)은 일반 글자는 4.5:1 이상(AA), 큰 글자는 3:1 이상을 권장해요. 7:1 이상이면 가장 높은 AAA 등급이에요.
자주 묻는 질문
투명도(알파)도 지원하나요?
네. rgba(0,0,0,0.5)나 #00000080처럼 넣으면 RGBA 값도 함께 보여 줘요.
사진에서 색을 뽑고 싶어요.
이미지 색상 추출에서 사진을 클릭해 색을 뽑은 뒤 여기에 붙여넣으세요.
팬톤(Pantone) 번호도 알 수 있나요?
팬톤은 유료 독점 색 체계라 정확한 변환을 제공하지 않아요. 가까운 색은 팬톤 공식 도구에서 HEX로 찾아볼 수 있어요.