이미지에서 색상 선택기

미리보기를 위해 마우스를 올리고, 색상을 고정하려면 클릭하세요

이미지 업로드

이미지에서 색상을 선택해야 하는 경우는 언제인가요?

디자이너는 원본 스타일 가이드에 접근하지 않고 로고에서 브랜드 색상을 일치시키고, 개발자는 테마 생성을 위해 사진에서 주요 색상을 추출하며, 교사는 수업을 위해 예술 작품에서 색상을 가져옵니다. 스포이드는 커서 아래 픽셀의 정확한 RGB를 읽고 헥스(``#RRGGBB``) 및 HSL로 변환합니다.

브라우저에 내장된 스포이드(Chrome의 ``EyeDropper API``)는 화면에서만 작동하며 업로드된 파일에서는 작동하지 않습니다. 이 도구는 이미지를 캔버스에 로드하고 어떤 픽셀에서든 샘플링할 수 있도록 하여 그 간극을 메웁니다.

일반적인 사용 사례

  • 경쟁업체 웹사이트의 스크린샷에서 브랜드 색상 일치시키기.
  • 그래픽 디자인 프로젝트를 위한 사진에서 팔레트 추출하기.
  • UI 스크린샷의 정확한 배경 색상 찾기.
  • 그레이딩 또는 메이크업 참조를 위한 초상화에서 피부 톤 샘플링하기.

자주 묻는 질문

색상이 원본과 약간 다른 이유는 무엇인가요?

큰 이미지는 샘플링 전에 맞추기 위해 축소됩니다 (최대 800px), 따라서 큰 이미지에서 선택된 값은 리샘플링된 미리보기에서 가져오며, 정확한 원본 픽셀이 아닙니다. JPEG 소스는 압축으로 인해 색상이 약간 변경됩니다.

투명 픽셀에서 선택할 수 있나요?

네 — 선택기는 RGBA를 표시합니다. 완전히 투명한 픽셀도 기본 RGB 값(종종 0,0,0 또는 캔버스 배경)을 가집니다.

스포이드가 애니메이션 GIF에서 작동하나요?

첫 번째 프레임을 샘플링합니다. 다른 프레임의 경우 원하는 순간을 스크린샷으로 캡처하고 그 스크린샷을 로드하세요.

헥스와 RGB는 어떻게 관련이 있나요?

헥스 ``#RRGGBB``는 RGB ``(R, G, B)``와 동일한 값을 10진수가 아닌 16진수로 작성한 것입니다. ``#FF0000``과 ``rgb(255, 0, 0)``은 모두 순수한 빨간색을 의미합니다.

내 이미지가 업로드되었나요?

아니요 — 이미지는 브라우저 캔버스에 로드되고 그곳에 유지됩니다. 네트워크 호출이 없습니다.