이미지 색상 선택기
로고 스크린샷에서 브랜드 색상을 찾아내거나 사진에서 벽의 색조를 추출하려면 일반적으로 포토샵을 열어야 합니다. 이 색상 선택 도구는 모든 이미지를 확대·축소 가능한 캔버스에 로드하여 클릭한 픽셀의 HEX, RGB 및 HSL 값과 함께 10×10 크기의 평균값도 표시합니다. 이를 통해 개별 픽셀 대신 특정 영역을 샘플링할 수 있으며, JPEG 노이즈 아티팩트를 피할 수 있습니다.
이미지에서 색상을 선택하는 방법
-
1
이미지를 업로드하거나 드롭하세요
JPG, PNG, WebP, 선택한 파일 형식이 뷰포트에 맞게 자동으로 크기가 조정됩니다.
-
2
해당 영역을 확대하세요
스크롤하여 확대하거나, 드래그하여 원하는 위치로 이동하세요.
-
3
픽셀을 클릭하세요
HEX, RGB, HSL 형식의 즉시 읽기 기능과 함께 확대된 색표도 제공됩니다.
-
4
필요한 표기법을 복사하세요.
단 한 번 클릭으로 HEX, rgb() 또는 hsl() 값을 클립보드에 복사할 수 있습니다.
-
5
여러 샘플을 저장하세요
디자인 참고용으로 이미지 전역에서 6~10가지 색상을 선별하여 팔레트를 구성하세요.
정확한 샘플을 확보하세요
실제 사진에서 원하는 결과가 단일 픽셀의 색상 선택인 경우는 거의 없습니다. JPEG 압축, 노이즈, 조명 변화 등으로 인해 시각적으로 균일한 영역 내에서도 픽셀 간에 색상 차이가 발생합니다.
샘플링 모드
| 모드 | 기능 | 사용 시점 |
|---|---|---|
| 점 | 커서 아래의 단일 픽셀 | 디자인 도구에서 스크린샷을 샘플링합니다 |
| 3×3 평균 | 클릭 위치 주변 9픽셀의 평균값 | 경량 압축된 JPG 사진 |
| 10 × 10 평균 | 100픽셀의 평균값 | 과도하게 압축되거나 잡음이 많은 사진 |
| 평균 영역 | 직사각형을 그리고 그 안의 모든 픽셀을 평균화합니다 | 로고 및 단색 디자인 자료 |
색상 공간 관련 주의사항
- 디스플레이의 스크린샷에는 sRGB 값이 표시되며, 선택된 색상은 원본 소스와 일치합니다.
- 카메라로 촬영한 사진은 Adobe RGB 또는 DCI-P3 형식일 수 있습니다. 피커는 sRGB로 표시하므로, 넓은 색역을 지원하는 스마트폰으로 촬영한 선명한 빨간색은 다소 채도가 낮게 보일 수 있습니다.
- ICC 프로파일이 포함된 PNG의 경우, 피커는 샘플링 전에 데이터를 sRGB로 변환하여 출력 결과가 일관되게 유지됩니다.
일반적인 사용 사례
- 추측하는 대신 스크린샷에서 고객의 로고 색상을 정확히 맞춥니다.
- 참조 사진(풍경, 무드보드, 영화 스틸컷)을 기반으로 팔레트를 구성합니다.
- 디자인 토큰을 잃은 렌더링된 웹 페이지의 HEX 값을 확인합니다.
- 이해관계자가 브랜드 색상을 올바르게 적용했는지 확인합니다.
개인정보 보호
이미지는 브라우저의 캔버스에 로드되며 결코 업로드되지 않습니다. 피커는 오직 클라이언트 측에서의 캔버스 데이터 읽기만을 사용하므로 기밀적인 디자인 정보가 항상 보호됩니다.
자주 묻는 질문
JPEG 압축은 특히 그라디언트나 가장자리 근처에서 색상이 약간 변합니다. 원본 파일이 JPG인 경우 10×10 평균 모드를 사용해 보세요. 원본 PNG 또는 SVG 파일이 있는 경우에는 이를 기준으로 샘플링하여 정확한 일치를 얻으세요.
직접적인 방법은 아닙니다. 원하는 프레임의 스크린샷을 촬영한 후 로드하세요. 정밀한 비디오에서 팔레트로 변환 작업을 수행하려면 비디오 도구를 사용하여 프레임들을 추출하고 각 프레임을 샘플링하세요.
클릭할 때 표시되는 프레임 중에서 샘플을 추출합니다. 샘플링 전에 원하는 프레임으로 일시 정지하거나 스크럽하세요.
한 세션당 최대 20가지 색상까지 저장할 수 있습니다. 팔레트는 로컬에 저장되므로 페이지를 새로 고쳐도 그대로 유지되지만, 브라우저 데이터를 삭제하면 팔레트가 사라집니다.
관련 도구
PNG를 SVG로 벡터화
브라우저에서 PNG 래스터 이미지를 SVG 패스로 변환합니다. 로고, 아이콘, 선화에 적합하며 임계값, 색상 수, 스무딩을 조절할 수 있습니다.
티어 리스트 만들기
텍스트와 기기 내 이미지로 비공개 티어 리스트를 만드세요. 행을 꾸미고 드래그나 키보드로 순위를 정한 뒤 JSON, PNG 또는 SVG로 내보낼 수 있습니다.
GIF 제작기
이미지 시퀀스나 짧은 영상을 애니메이션 GIF로 변환합니다. 내보내기 전에 프레임률, 반복 횟수, 크기를 조정하세요.
QR 코드 생성기
텍스트 또는 URL로 브라우저 안에서 QR 코드를 만들고 PNG로 다운로드하세요.
그래피티 글자 생성기
태그, 버블, 블록, 스텐실, 네온, 와일드 효과로 글자를 꾸미세요. 색상을 조절하고 브라우저에서 PNG 또는 SVG로 내보낼 수 있습니다.
밈 이미지 생성기
JPG, PNG, WebP 이미지에 고정된 위아래 문구를 넣고 글꼴, 색상, 외곽선을 조절한 뒤 브라우저에서 PNG로 저장하세요.