HWB → HEX 변환기: 브라우저에서 CSS 색상 변환
HWB → HEX 변환기는 입력하면서 HWB 색상을 16진수 색상 값으로 바꾸고, 어느 한쪽을 편집하면 다른 쪽이 실시간으로 업데이트됩니다. #abc, rgb(1 2 3 / 50%), 색상 이름을 포함한 유연한 색상 입력을 받습니다. 스워치로 색상을 검토하고, 바로 붙여넣을 수 있는 CSS 한 줄을 복사하며, 색상이 sRGB를 벗어나면 색역 초과 경고를 확인하세요.
HWB → HEX 변환기는 HWB 색상 입력을 16진수 값으로 바꾸고 어느 형식이든 실시간 업데이트로 편집할 수 있게 합니다. 온라인에서 HWB 색상을 HEX로 변환하거나, 값을 확인하거나, 코드용 색상을 준비해야 할 때 유용합니다. 스워치가 시각적 참조를 제공하고, 도구는 바로 붙여넣을 수 있는 CSS 한 줄을 제공합니다.
변환기는 #abc 같은 짧은 16진수 색상, rgb(1 2 3 / 50%) 같은 최신 RGB 구문, 색상 이름을 포함한 유연한 색상 입력을 받습니다. 한쪽을 편집하면 다른 쪽이 실시간으로 업데이트됩니다. 색상이 sRGB를 벗어나면 도구도 색역 초과 경고를 표시합니다. 결과를 확인하면서 해당 상태를 알아차리는 데 도움이 됩니다.
HWB와 16진수는 색상을 표현하는 서로 다른 방법입니다. HWB는 색상, 흰색, 검은색으로 색상을 표현하고, HEX는 16진수 숫자로 색상 구성 요소를 표현합니다. 이들을 변환하면 HWB로 색상을 받았지만 16진수 색상을 사용하는 시스템이나 코드베이스용 HEX 값이 필요할 때, 또는 두 표현의 관계를 확인하고 싶을 때 도움이 됩니다.
도구는 브라우저에서 완전히 실행됩니다. 입력은 사용자의 기기에서 처리되며 업로드되거나 저장되거나 서버로 전송되지 않습니다. 무료이며, 가입이 필요 없고, 페이지가 로드된 후에는 오프라인으로 계속 동작합니다.
이 변환기는 코드, 문서, 티켓, 리뷰에서 CSS 색상을 다루는 개발자, 디자이너, DevOps 엔지니어에게 유용합니다. 단일 값을 확인하든 공유할 스니펫을 준비하든, 실시간 편집과 복사 가능한 결과로 변환이 간단해집니다.
1단계: 입력 필드에 HWB 색상을 입력하세요. #abc, rgb(1 2 3 / 50%), 색상 이름 같은 지원 CSS 색상 형태도 사용할 수 있습니다.
2단계: 업데이트되는 HEX 결과를 검토하세요. HEX 쪽을 편집하면 변환기가 HWB 값도 업데이트합니다.
3단계: 색상 스워치와 색역 초과 경고를 확인하세요. 경고는 색상이 sRGB를 벗어났음을 나타냅니다.
4단계: 16진수 결과나 바로 붙여넣을 수 있는 CSS 한 줄을 복사해 코드, 문서, 메모에 사용하세요.
사용 사례: HWB 색상을 16진수 값만 받는 디자인 시스템이나 다른 도구로 옮기세요.
사용 사례: 어느 한쪽을 편집하고 실시간 결과를 검토해 HEX 값이 받은 HWB 색상과 일치하는지 확인하세요.
사용 사례: 문서, 티켓, 커밋 메시지용으로 바로 붙여넣을 수 있는 CSS 한 줄을 준비하세요.
사용 사례: 결과를 코드에 추가하기 전에 색상 변환을 간단히 검증하세요.
사용 사례: 코드 리뷰 중 HWB 입력, HEX 결과, 표시된 스워치를 비교해 색상 값을 검토하세요.
사용 사례: 변환된 값을 사용하기 전에 색상이 sRGB를 벗어나는지 확인하세요.