이미지 색상 추출 — 대표 색, 8색 팔레트, HEX 값
포스터, 스크린샷, 사진을 선택하면 브라우저에서 중위값 분할(median-cut) 양자화로 대표 색과 8색 팔레트를 계산합니다. 스와치에 HEX가 표시되며 클릭하면 복사됩니다. 색상 개수 조절, HSL/CMYK 출력, CSS 변수 내보내기는 없습니다.
이 색상 추출 도구가 출력하는 것과 하지 않는 것
대표 색 + 8색 팔레트
불러올 때마다 중위값 분할 양자화를 실행하며 가장 큰 색상 클러스터가 대표 색이 됩니다. 팔레트는 항상 8색입니다. 이미지는 16:9 영역에 contain으로 표시되는 미리보기일 뿐이며 픽셀 단위 조작은 없습니다.
색상 개수와 형식 설정 없음
팔레트 개수는 8로 고정되어 있고(대표 색은 별도의 5색 양자화에서 계산), 내부는 RGB, 표시는 소문자 HEX만 사용합니다. HSL, CMYK, RGB 텍스트 출력이나 CSS 변수 내보내기는 없습니다.
스와치를 클릭해 HEX 복사
각 원형 스와치를 클릭하면 HEX가 클립보드에 복사되고 토스트가 표시됩니다. 이미지 자체는 클릭할 수 없어 스포이드나 특정 픽셀 하나를 집는 기능은 없습니다.
canvas 처리, 하지만 로컬 파일만
선택한 이미지를 canvas에 그린 뒤 getImageData로 읽는 과정이 모두 브라우저 안에서 이루어집니다. 이미지 URL 입력란이 없어서 교차 출처로 인한 canvas 오염이 발생하지 않으며, 선택한 파일만 분석합니다.
샘플링에서 거의 흰색과 투명 픽셀 제외
10픽셀마다 하나를 샘플링하고, alpha가 125 미만인 픽셀과 세 채널이 모두 250을 넘는 거의 흰색 픽셀은 무시합니다. 그래서 흰 배경과 투명 영역이 결과를 지배하지 않습니다.
이미지 색상 추출 FAQ
색상은 어떻게 계산되나요?
ColorThief의 중위값 분할 양자화(MMCQ)를 사용합니다. 대표 색은 5색 양자화의 첫 번째 클러스터이고, 팔레트는 8색 양자화입니다. quality 기본값은 10이며 10픽셀마다 샘플링합니다.
색상 개수를 바꿀 수 있나요?
아니요. 8색이 고정이고 슬라이더나 입력란이 없습니다. 대표 색은 별도의 5색 양자화에서 나옵니다. 새 파일을 선택할 때마다 팔레트가 다시 계산되어 교체됩니다.
어떤 색상 형식으로 얻을 수 있나요?
소문자 HEX만 제공됩니다. 각 스와치에 표시되고 클릭하면 복사됩니다. RGB, HSL, CMYK 수치 표시, CSS 사용자 지정 속성, PNG나 텍스트 내보내기는 없습니다.
스포이드나 단일 픽셀 추출이 가능한가요?
아니요. 이미지는 미리보기일 뿐이고 스와치를 클릭하면 그 HEX만 복사됩니다. 픽셀 단위 추출이나 사진의 특정 지점을 집는 기능은 없습니다.
이미지가 업로드되나요? canvas에서 처리하나요?
모두 로컬 canvas 안에서 처리되며 업로드는 전혀 없습니다. 파일은 object URL로 불러와 고정 16:9 미리보기 영역에 표시한 뒤 원본 크기로 canvas에 그려 분석합니다.
교차 출처 이미지가 canvas를 오염시키나요?
이 페이지는 로컬 파일 선택만 지원하고 URL 입력도 getColorFromUrl 호출도 없어서 CORS 오염이 발생할 수 없습니다. 웹 이미지가 필요하면 먼저 다운로드한 뒤 파일로 선택하세요.
흰색과 투명 영역이 제외되는 이유는 무엇이고, 큰 이미지는 어떻게 되나요?
alpha가 125 미만인 픽셀과 세 채널이 모두 250을 넘는 거의 흰색 픽셀은 건너뜁니다. 아주 큰 이미지는 원본 크기로 그려 전체를 읽기 때문에 느리고 메모리를 많이 사용합니다. 크기 조절이나 크기 제한은 없습니다.
