HEX → OKLCH 변환기: 온라인 실시간 색상 편집
이 HEX → OKLCH 변환기는 어느 한쪽을 편집하면 색상 값을 실시간으로 업데이트합니다. HEX 색상을 입력하거나 짧은 HEX, RGB, 색상 이름 같은 지원 입력을 사용하세요. 색상 스워치를 보고, 바로 붙여넣을 수 있는 CSS 한 줄을 복사하며, 색상이 sRGB를 벗어나면 색역 초과 경고를 확인하세요.
HEX → OKLCH 변환기는 색상 값을 CSS와 다른 개발 작업에 사용할 수 있는 형식으로 바꿉니다. HEX 색상을 입력해 OKLCH 값을 확인하거나, 어느 한쪽을 편집하면 다른 쪽이 실시간으로 업데이트되는 것을 보세요. 스워치가 색상을 검토하는 데 도움이 되고, 도구는 바로 붙여넣을 수 있는 CSS 한 줄을 제공합니다.
파서는 #abc 같은 짧은 형태를 포함한 16진수 값은 물론, rgb(1 2 3 / 50%) 같은 RGB 입력과 색상 이름도 받습니다. 색상이 sRGB를 벗어나면 변환기가 경고를 표시합니다. 이 지원 입력들 덕분에 필요한 형태와 다른 형태로 색상 값이 제공될 때 유용합니다.
HEX는 보통 16진수 채널 값으로 색상을 표현하고, OKLCH는 명도, 채도, 색상으로 색상을 표현합니다. 이들을 변환하면 프로젝트나 워크플로가 HEX 대신 OKLCH를 요구할 때 도움이 됩니다. 실시간 양방향 편집으로 어느 형식이든 바꿔 업데이트된 결과를 보면서 값을 확인할 수도 있습니다.
변환기는 브라우저에서 완전히 실행됩니다. 입력은 사용자의 기기에서 처리되며 서버로 전송되지 않습니다. 무료이며, 가입이 필요 없고, 페이지가 로드된 후에는 오프라인으로 동작합니다. 개발자와 DevOps 엔지니어는 온라인 서비스에 보내지 않고 색상 값을 확인, 준비, 복사하는 데 사용할 수 있습니다.
1단계: #abc 같은 HEX 색상이나 RGB, 색상 이름 같은 다른 지원 색상 값을 입력하세요.
2단계: 입력이나 OKLCH 값을 편집해 다른 쪽이 실시간으로 업데이트되는 것을 보세요.
3단계: 스워치로 색상을 시각적으로 검토하고 색역 초과 경고를 찾으세요.
4단계: 바로 붙여넣을 수 있는 CSS 한 줄을 복사해 코드나 문서에 사용하세요.
사용 사례: 디자인 시스템이나 스타일시트가 OKLCH 값을 기대할 때 HEX 색상을 OKLCH로 변환하세요.
사용 사례: 실시간 값과 스워치를 비교해 OKLCH 값이 받은 HEX 색상과 일치하는지 확인하세요.
사용 사례: 문서, 티켓, 커밋 메시지용 HEX와 OKLCH 색상 스니펫을 준비하세요.
사용 사례: 결과를 코드에 추가하기 전에 색상 변환을 간단히 검증하세요.
사용 사례: 변환기의 색역 초과 경고로 색상이 sRGB를 벗어나는지 검토하세요.
사용 사례: CSS 작업 중 어느 형식으로든 색상 값을 편집하고 대응 값이 실시간으로 업데이트되는 것을 보세요.