본문으로 건너뛰기
EVOA Toolbox

이미지 색상 팔레트 추출

이미지에서 주요 색상을 추출하고, hex 코드를 복사하고, 스포이드로 정확한 픽셀 색을 고른 뒤 팔레트를 내보내세요.

브라우저에서 로컬로 처리됩니다. 파일은 업로드되지 않습니다.

도구를 불러오는 중…

도구 소개

사진, 스크린샷, 로고, 일러스트를 올리면 주요 색상과 각 색상이 이미지에서 차지하는 비율을 알려 드립니다. 이미지는 가장 긴 변이 약 100픽셀이 되도록 축소된 뒤 결정적(deterministic) k-means 알고리즘으로 군집화되므로, 같은 이미지는 항상 같은 팔레트를 만듭니다. 투명한 픽셀은 무시되므로 배경이 비어 있는 로고도 올바르게 처리됩니다.

견본을 클릭하면 hex 코드가 복사됩니다. 이미지의 원하는 위치를 클릭하면 그 지점의 정확한 픽셀 색상을 고를 수 있고, 기본 제공 스포이드(Chromium 기반 브라우저에서 사용 가능)를 사용하면 화면의 어떤 색이든 고를 수 있습니다. 고른 색상은 추출된 색상과 함께 내보내기에 추가됩니다.

CSS 변수, Tailwind v3/v4 코드 조각, JSON, PNG 견본 띠로 내보낼 수 있습니다. 이미지는 사용자의 기기에서 로컬로 디코딩되며 업로드되지 않습니다.

사용 방법

  1. 1이미지(PNG, JPG, WebP, GIF, AVIF 또는 SVG)를 추가하세요.
  2. 2슬라이더로 추출할 주요 색상의 개수를 정하세요.
  3. 3견본을 클릭해 hex 코드를 복사하세요.
  4. 4이미지를 클릭하거나 스포이드를 사용해 원하는 색상을 직접 고르세요.
  5. 5결과를 필요한 형식으로 내보내세요.

지원 형식

입력: PNG, JPG, WebP, GIF(첫 프레임), AVIF, SVG. 출력: CSS, Tailwind, JSON, PNG.

프라이버시

이 도구는 브라우저에서 실행됩니다. 입력하신 데이터는 사용자의 기기에서 처리되며 당사 서버로 전송되지 않습니다.

제한 사항

  • 주요 색상은 비슷한 픽셀의 평균이므로 어느 한 픽셀과 정확히 일치하지 않을 수 있습니다. 정확한 값이 필요하면 스포이드를 사용하세요.
  • 색상 개수를 적게 요청하면 아주 작은 강조 색상이 더 큰 이웃 색상에 합쳐질 수 있습니다.
  • 기본 제공 스포이드는 Firefox와 Safari에서 사용할 수 없습니다. 이미지를 클릭하는 방식은 모든 브라우저에서 작동합니다.
  • 색상 관리는 적용되지 않습니다. 값은 브라우저가 디코딩한 그대로(sRGB)입니다.

FAQ

색상은 어떻게 선택되나요?

픽셀을 비슷한 색상끼리 묶은 뒤 k-means 군집화로 다듬습니다. 결과는 각 군집의 평균 색상과 그 군집이 차지하는 픽셀 비율입니다.

같은 이미지가 항상 같은 색상을 만드는 이유는 무엇인가요?

알고리즘이 고정된 시드를 사용하므로 결과를 반복해서 얻을 수 있습니다. 색상 개수를 바꾸면 군집화 결과도 달라집니다.

투명 PNG에도 사용할 수 있나요?

네. 완전히 또는 대부분 투명한 픽셀은 무시되므로 팔레트에 검은색이나 흰색으로 나타나지 않습니다.

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

아니요. 이미지는 브라우저에서 디코딩되고 분석됩니다.

관련 도구