도구 실행
16진수 색상 코드를 입력하여 표준 RGB 및 HSL 형식으로 손쉽게 변환할 수 있는 웹 기반 색상 변환 도구입니다. 웹 디자인과 프론트엔드 개발, 그래픽 작업 등 다양한 디자인 환경에서 색상 코드를 직관적으로 다룰 수 있도록 돕습니다. 기본값으로 주황색 계열의 16진수 색상(#ff5733)이 지정되어 있으며, 사용자는 원하는 색상 코드를 직접 입력하거나 색상 선택기를 통해 자유롭게 변경할 수 있습니다. 3자리 단축 코드(예: #03f)를 입력하는 경우 각 자릿수를 자동으로 확장하여 6자리 표준 형식(#0033ff)으로 변환하며, 앞에 샵(#) 기호가 생략된 경우에도 자동으로 보정하여 처리합니다. 변환을 실행하면 대문자와 소문자로 구분된 6자리 16진수 텍스트, 빨강(R), 초록(G), 파랑(B) 정수 수치 및 텍스트 표현, 색조(Hue), 채도(Saturation), 명도(Lightness)를 나타내는 정수 반올림 HSL 수치를 즉시 확인할 수 있습니다. 또한 가중 밝기 계산 방식(기준값 128)을 바탕으로 해당 색상이 밝은 색상인지 어두운 색상인지 여부를 분석하여 배경색 및 텍스트 대비 설계에 유용한 시각적 정보를 함께 제공합니다.
사용 방법
- 색상 선택기 또는 텍스트 입력란에 16진수 색상 코드(예: #3498db 또는 3498db)를 입력합니다.
- 3자리 단축 코드(예: #f00)를 입력하면 6자리 표준 형식(#ff0000)으로 자동 확장됩니다.
- 변환 버튼을 누르면 하단 결과 창에서 RGB 및 HSL 수치와 명도 판별 결과를 확인합니다.
예시
- 기본값인 #ff5733을 입력하면 대문자 #FF5733, RGB(255, 87, 51), HSL(11도, 100%, 60%) 값과 함께 밝은 색상 여부 결과가 출력됩니다.
- 3자리 단축 코드 #03f를 입력하면 6자리 형식인 #0033FF로 자동 변환되며 RGB(0, 51, 255) 및 정수로 반올림된 HSL(228도, 100%, 50%) 값을 확인할 수 있습니다.
자주 묻는 질문
3자리 16진수 색상 코드도 입력할 수 있습니까?
네, #abc와 같은 3자리 코드를 입력하면 각 문자가 반복되어 #aabbcc 형태의 6자리 표준 코드로 자동 변환됩니다.
'#' 기호 없이 숫자와 영문자만 입력해도 됩니까?
네, 앞에 '#' 기호가 없어도 자동으로 추가되어 정상적으로 변환됩니다.
RGB나 HSL 값을 입력하여 16진수로 변환할 수 있습니까?
현재 도구는 16진수 색상 코드를 입력받아 RGB 및 HSL로 변환하는 기능만 제공합니다.
유효하지 않은 색상 코드를 입력하면 어떻게 됩니까?
16진수 규격에 맞지 않는 문자가 포함된 경우, 결과 영역에 오류 안내 메시지가 표시됩니다.