CrateX.app

이미지 컬러 피커 및 팔레트

이미지를 클릭하여 색상을 선택하고 주요 색상과 팔레트를 자동 추출하며 HEX/RGB를 복사하고 CSS 변수를 내보냅니다. PNG, JPG/JPEG, WebP, AVIF, HEIC/HEIF 지원.

이미지를 여기에 드래그 앤 드롭하거나 클릭하여 선택

PNG / JPG / JPEG / WebP / AVIF / HEIC / HEIF 지원

이미지 컬러 피커 및 팔레트

빠른 시작

이미지 가져오기: 드래그 앤 드롭 또는 클릭하여 선택

패널 전환: 데스크탑은 사이드 패널; 모바일은 하단 버튼 탭

클릭하여 선택: 이미지의 아무 곳이나 클릭하여 해당 픽셀의 색상 가져오기

색상 복사: 선택 후 HEX/RGB/CSS 형식으로 복사

색상 수 설정: 슬라이더 드래그 또는 프리셋 클릭 (4/6/8/12/16/24/32)

팔레트 추출: 추출 버튼을 클릭하여 주요 색상 목록 가져오기

CSS 내보내기: 추출 후 CSS 변수 파일 내보내기

JSON 내보내기: 추출 후 JSON 데이터 파일 내보내기

초기화: 현재 이미지 및 결과 지우기

자주 쓰는 활용 사례

디자인/포스터 색상 선택

색상 구성표를 위한 주요 색상 및 강조 색상 추출

테마/디자인 시스템

프로젝트용 CSS 변수 또는 JSON 내보내기

컴포넌트 스타일링

버튼, 태그, 차트에 맞는 색상 추출

브랜드 일관성

브랜드 자산에서 표준 색상 팔레트 추출

컬러 피커 및 팔레트 옵션

색상 수: 2–32, 일반적으로 8/12; 사진/그라데이션은 16–32 권장

프리셋 버튼: 4/6/8/12/16/24/32 원클릭 전환

정렬: 백분율 높은 순, 가장 흔한 색상이 먼저

색상 옆 숫자: 이미지 내 픽셀 백분율 표시

활용 팁

먼저 8/12로 전체 효과를 보고 필요에 따라 16/24/32로 증가

프로젝트에서 사용 시 --color-1을 의미론적 이름 (예: --color-primary)으로 변경 권장

큰 이미지 추출 시 브라우저 스로틀링을 피하기 위해 페이지를 전면에 유지

제한 사항 및 호환성

단일 파일 제한 128MB, 매우 큰 이미지는 느려질 수 있음

팔레트 추출은 성능을 위해 자동 다운샘플링, 결과는 대표 색상

HEIC/HEIF 디코딩은 브라우저 지원에 따라 다름, 실패 시 JPG/PNG로 변환

투명 픽셀은 무시되거나 실제 RGBA로 처리됨

개인정보 보호 및 보안

모든 처리는 브라우저 내에서 완료; 데이터가 기기를 떠나지 않습니다

자주 묻는 질문

다음 작업에 도움이 되는 관련 도구입니다.