색상 변환기
색상 선택기, 무작위 색상, 실시간 미리보기, 채널 조정, 복사 가능한 CSS 문자열로 하나의 색상을 6자리 HEX, RGB, HSL, CMYK 사이에서 브라우저 안에서 변환합니다.
HEX
#
RGB
R
G
B
HSL
H
S
L
CMYK
C
M
Y
K
색상 변환기6자리 HEX 또는 RGB/HSL/CMYK 채널 입력색상 선택기나 무작위 색상 사용 후 동기화 값 확인HEX, RGB, HSL, CMYK CSS 문자열 복사
빠른 시작
1
2
3
자주 쓰는 활용 사례
디자인 전달
시안의 HEX 를 CSS RGB/HSL 로 변환
스타일 가이드
컴포넌트 라이브러리의 색상 형식/표기 통일
인쇄 참고
화면 색상을 CMYK 초기 추정값으로 변환하고, 최종값은 교정과 인쇄 워크플로에서 확인하세요.
접근성
미리보기는 빠른 시각 확인용입니다. 정확한 비율은 전용 대비 도구로 확인하세요.
변환 매개변수 및 표시
입력 규칙: HEX는 6자리만 지원합니다(#RRGGBB, #RGB, #RGBA, #RRGGBBAA, 알파는 미지원). RGB는 0–255, H는 0–360, S/L은 0–100, CMYK는 0–100입니다. 입력은 대소문자를 구분하지 않습니다.
미리보기: 데스크톱 우측 라이브 미리보기; 모바일은 미리보기 없는 경량 모드
색상 선택기: 각 카드 우측 상단 팔레트 버튼으로 열기
HEX 대문자 정책: 출력은 대문자로 표준화(예 #1E90FF), 입력은 대소문자 구분 안 함; 전환 스위치 없음
미세 조정: 채널 문자를 좌우로 드래그(Shift×10, Alt÷0.1)
복사 출력: 복사 버튼은 표준화된 문자열(HEX 대문자)을 출력
활용 팁
정밀도: 기기/앱별 색 관리가 달라 스포이드 값이 약간 다를 수 있음
알파: 현재 형식은 알파 미포함; rgba()/hsla() 또는 별도 채널 사용
색 공간: 웹 기본은 sRGB; P3/Display‑P3 환경에서는 주의 깊게 검증
팀 일관성: CSS 에서 표준 형식(HSL 등)을 합의
제한 사항 및 호환성
기기간 차이: 모니터/브라우저/OS의 색 관리가 달라 보기가 다를 수 있음
CMYK는 근사값입니다. 값은 ICC 프로필, 종이, 잉크, 장치, 교정에 따라 달라집니다. 인쇄용 최종값이 아니라 참고값으로 사용하세요.
알파 없음: 이 도구는 투명도, rgba(), hsla(), #RGBA 또는 #RRGGBBAA 값을 처리하지 않습니다.
CSS 색상 하위 집합: 명명된 색상, transparent, currentColor, HWB, HSV/HSB, Lab, LCH, OKLab, OKLCH, Display-P3, device-cmyk(), 상대 색상, color-mix(), contrast-color()는 이 도구 범위 밖입니다.
이미지 또는 팔레트 도구 아님: 이 페이지는 이미지 샘플링, 화면 스포이드, 팔레트 생성, 그라데이션 생성, 대비 비율 확인, CSS 변수 내보내기, design token 내보내기를 하지 않습니다.
개인정보 보호 및 보안
처리는 브라우저 안에서 실행됩니다. 현재 색상, 채널 값, 출력 설정, 소수 자릿수, 대문자 HEX 선호, 미리보기 선호, 최근 색상 목록은 현재 브라우저 세션이나 브라우저 저장소에 남을 수 있습니다. 작업 공간을 저장하거나 WebDAV 동기화를 켜면 현재 색상과 설정이 동기화 설정에 따라 저장될 수 있습니다. 최근 색상은 WebDAV로 동기화되지 않습니다. HEX, RGB, HSL, CMYK 문자열은 현재 색상과 설정에서 다시 계산되며 별도 결과로 저장되지 않습니다. 이 페이지는 이미지를 읽거나 화면을 샘플링하거나 URL을 가져오거나 서버 측 변환을 위해 색상을 보내지 않습니다. 공유 기기에서는 필요할 때 색상, 설정, 사이트 데이터를 지우세요.
자주 묻는 질문
현재 미지원입니다. 6자리 HEX(#RRGGBB)를 사용하세요.
RGB 는 0–255(정수); H는 0–360, S/L은 0–100%
CMYK는 종이, 잉크, 장치, ICC 설정에 따라 달라집니다. 여기의 값은 근사치입니다. CMYK에서 HEX/RGB로 변환하는 기능은 참고용이며, 정식 인쇄에는 ICC 프로필과 교정이 필요합니다.
현재는 지원하지 않습니다. rgba()/hsla() 또는 별도의 알파 값을 사용하세요.
컬러 관리, 렌더링, 화면 보정 차이 때문입니다. 본 도구는 sRGB 기준으로 계산하며 참고용입니다.
현재 sRGB 기반입니다. P3 또는 Display-P3 워크플로에서는 대상 장치, 브라우저, ICC 프로필로 확인하세요.