Image Color Picker

훌륭한

HEX 컬러 피커

차분한 작업 공간에서 HEX를 조정하고 HWB, HSL, HSV, RGB, OKLCH 값을 비교하세요.

HEX 색상 피커

하나의 HEX 색상 피커, 여섯 가지 색상 모델

HEX 색상 코드를 입력하면 RGB, HSL, HSV, HWB, OKLCH의 해당 값을 즉시 확인할 수 있습니다. 슬라이더를 움직이면 6가지 표현이 모두 실시간으로 동기화됩니다. HEX 코드와 URL 해시가 함께 동기화되어 몇 초 만에 원하는 색상을 북마크하거나 공유할 수 있습니다.

HEX에서 RGB로 실시간 변환

#3b82f6과 같은 HEX 색상을 입력하면 RGB 값이 즉시 업데이트됩니다. HEX 파인더는 3자리 단축 코드도 지원합니다.

URL 공유 기능이 있는 HEX 코드 파인더

색상을 조정할 때마다 URL 해시가 자동 업데이트되어 이 HEX 코드 파인더가 공유 가능한 북마크가 됩니다. 팀원에게 링크를 보내면 같은 색상을 볼 수 있습니다.

6가지 색상 모델 동기화

HEX, RGB, HSL, HSV, HWB, OKLCH가 모두 함께 업데이트됩니다. 모델을 전환해도 색상이 유지됩니다 — 디자인 토큰과 CSS 변수에 완벽합니다.

HSL, RGB, OKLCH 색상 모델 슬라이더를 표시하는 HEX 색상 피커 인터페이스

색상 코드 파인더

모든 색상 코드 찾기 — HEX, RGB, HSL, OKLCH

이 색상 코드 파인더는 웹 디자인, 앱 개발, 디지털 인쇄에 사용되는 모든 표준을 다룹니다. HEX는 CSS와 HTML의 기본 형식입니다. RGB는 화면의 기본 형식입니다. HSL은 디자이너에게 인간이 읽기 쉬운 형식입니다. OKLCH는 CSS Color Level 4의 차세대 지각적 형식입니다. 4가지 모두 동시에 사용 가능 — 워크플로에 맞는 것을 복사하세요.

선명한 파란색의 HEX, RGB, HSL, OKLCH 값을 표시하는 색상 코드 파인더
CSS 준비된 HEX와 RGB 색상 코드 값을 표시하는 HTML 색상 피커

HTML 색상 피커

CSS와 웹 디자인을 위한 HTML 색상 피커

인라인 스타일 작성, 디자인 토큰 정의, CSS 변수 라이브러리 유지 관리 등 어떤 작업이든 이 HTML 색상 피커가 필요한 정확한 코드를 제공합니다. 색상, 채도, 명도를 시각적으로 조정한 후 HEX 색상 코드나 CSS rgb() 값을 스타일시트에 직접 복사하세요.

  • 유효한 CSS hex, rgb(), hsl(), hwb(), oklch() 값을 즉시 생성.
  • URL 해시 동기화로 어떤 색상이든 브라우저 북마크로 저장하고 공유 가능.
  • 색상이 Display-P3에만 해당되고 sRGB 범위를 벗어날 때 색역 표시기가 표시.
  • 오프라인 작동 — API 호출 없음, 서버 의존성 없음.

RGB 색상 피커

정밀 슬라이더가 있는 RGB 색상 피커

빨강, 초록, 파랑 채널을 위한 세 개의 독립 슬라이더가 있는 RGB 색상 피커

전용 RGB 채널

세 개의 독립적인 R, G, B 슬라이더로 채널별로 색상을 혼합하세요. RGB 피커는 드래그하는 동안 십진수 값과 HEX 코드를 실시간으로 표시합니다.

RGB 채널 값과 HEX 색상 코드 간의 실시간 변환을 표시하는 RGB 피커

RGB에서 HEX로, 그리고 반대로

알려진 HEX 코드를 붙여넣어 RGB 분해를 즉시 확인하거나, RGB 피커 슬라이더를 조정해 사용자 지정 색조의 HEX 코드를 찾으세요. 별도의 변환기가 필요 없습니다.

sRGB와 Display-P3 색역 스와치를 나란히 비교하는 RGB 색상 피커

와이드 색역을 지원하는 RGB 색상 피커

sRGB와 Display-P3 색역을 전환하여 선택한 색상이 와이드 색역 화면에서 재현 가능한지 확인하세요. 두 스와치가 나란히 업데이트됩니다.

자주 묻는 질문

HEX 색상 피커에 관한 질문