HEX RGB HSL 색상 변환기

같은 색을 HEX, RGB, HSL로 표현하기

웹 디자인에서는 같은 색도 여러 방식으로 기록합니다. HEX는 #RRGGBB 형식의 16진수, RGB는 빨강·초록·파랑 채널, HSL은 색상·채도·명도로 표현합니다. 입력란을 수정하고 다른 곳을 누르면 나머지 두 형식과 미리보기가 함께 갱신됩니다.

지원하는 값과 변환 예시

HEX는 #fff 또는 #ffffff처럼 3자리와 6자리를 지원합니다. RGB는 0부터 255까지의 세 숫자, HSL은 색상 각도와 0부터 100까지의 채도·명도입니다. #ff0000은 rgb(255, 0, 0), hsl(0, 100%, 50%)로 표시됩니다. 알파 투명도와 RGB 퍼센트 문법은 지원하지 않습니다.

명도별 색상표 활용

미리보기 아래의 다섯 색은 선택한 색의 명도를 바꾼 결과입니다. 스와치를 선택하면 그 색을 새로운 기준으로 사용할 수 있습니다. 색상 코드를 복사하여 CSS나 디자인 프로그램에 붙여넣을 수 있습니다.

자주 묻는 질문

표시값이 조금 달라지는 이유는 무엇인가요? RGB 채널과 HSL 표시값은 반올림되므로 반복해서 역변환하면 미세한 차이가 생길 수 있습니다. 화면마다 색이 같나요? 실제 표현은 디스플레이와 색 관리 설정에 따라 달라질 수 있습니다.

함께 쓰는 도구