본문 바로가기
개발자

색상 변환기

HEX·RGB·HSL 색상 코드를 서로 변환합니다.

  • 브라우저에서 처리
  • 로그인 없이 사용

색상 입력

#RRGGBB 또는 #RGB

예: rgb(255, 87, 51) 또는 255, 87, 51

예: hsl(11, 100%, 60%) 또는 11, 100, 60

변환 결과

입력 즉시 변환

미리보기

  • HEX

    #3b82f6

  • RGB

    rgb(59, 130, 246)

  • HSL

    hsl(217, 91%, 60%)

색상 변환기 사용 안내

이런 작업에 사용하세요

디자인 시안의 HEX 색상 코드를 CSS의 rgb()·hsl() 값으로 바꾸거나, 반대로 RGB·HSL 값을 HEX로 옮길 때 사용합니다.

필요한 항목

HEX(#RRGGBB 또는 #RGB, # 생략 가능), RGB(rgb(255, 87, 51) 또는 255, 87, 51), HSL(hsl(11, 100%, 60%) 또는 11, 100, 60) 중 아무 칸에 입력하거나 색상 선택기로 고르면 나머지 형식과 미리보기가 입력 즉시 바뀝니다.

사용 예시

예: HEX 칸에 #FF5733을 입력하면 rgb(255, 87, 51), hsl(11, 100%, 60%)로 바로 변환되고, 각 값 옆의 복사 버튼으로 CSS에 붙여넣을 수 있습니다.

확인 사항

투명도(알파)는 지원하지 않아 #RRGGBBAA, rgba(), hsla() 값은 인식하지 않습니다. HSL은 정수로 반올림되므로 RGB를 거치며 값이 조금 달라질 수 있습니다(예: hsl(11, 100%, 60%)를 입력하면 #FF5733의 87이 아닌 rgb(255, 88, 51)이 됩니다).

함께 쓰기 좋은 도구

입력한 내용은 서버로 전송되지 않고 이 브라우저에서만 처리됩니다.