🎨 색상 코드 변환기

색상 변환기 사용 방법

이 도구를 사용하면 가장 일반적인 웹 색상 코드 형식인 HEX, RGB, HSL 간에 즉시 변환할 수 있습니다.

1. 입력 필드(HEX, RGB 또는 HSL) 중 하나에 유효한 색상 코드를 입력합니다.
2. 입력하는 동안 다른 두 필드는 해당 변환 값으로 자동 업데이트됩니다.
3. 입력 필드 위의 정사각형 미리보기 상자에 입력하거나 변환한 색상이 표시됩니다.
4. 잘못된 코드를 입력하면 입력 필드 아래에 오류 메시지가 나타납니다.
5. 자동으로 변환된 출력 필드는 결과임을 나타내기 위해 연한 파란색 배경을 갖습니다.

색상 코드 이해하기

• HEX (16진수): 일반적인 웹 표준입니다. '#' 다음에 빨강, 초록, 파랑의 강도를 나타내는 6개의 문자(0-9, A-F)를 사용합니다.
  형식: #RRGGBB (예: 토마토 빨강은 #FF6347).
  쌍이 동일한 경우(예: 빨강은 #F00이 #FF0000과 동일) 세 글자 약식 버전(#RGB)도 유효합니다.
• RGB (빨강, 초록, 파랑): 각각 0(없음)에서 255(최대 강도)까지의 빨강, 초록, 파랑 빛의 강도로 색상을 정의합니다.
  형식: R, G, B (예: 토마토 빨강은 255, 99, 71). CSS 형식 rgb(R, G, B)도 사용할 수 있습니다.
• HSL (색조, 채도, 밝기): 색상을 직관적으로 표현하는 방법입니다.
  • 색조 (H): 색상환에서 색상의 위치입니다 (0-360도, 예: 0은 빨강, 120은 초록, 240은 파랑).
  • 채도 (S): 색상의 강도 또는 순도입니다 (0%는 회색조, 100%는 완전히 채워짐).
  • 밝기 (L): 색상의 밝기입니다 (0%는 검정, 50%는 순색, 100%는 흰색).
  형식: H, S%, L% (예: 토마토 빨강은 9, 100%, 64%). CSS 형식 hsl(H, S%, L%)도 사용할 수 있습니다.

예시: HEX 필드에 #3498DB를 입력해 보세요. RGB에는 52, 152, 219가, HSL에는 208, 71%, 53%가 나타나고 미리보기 상자가 파란색으로 바뀝니다.