색상 추출기

이미지에서 색상을 추출하고 디자인 팔레트를 생성합니다.

이미지에서 색상 팔레트 추출하기

소개

색상 추출기는 이미지를 분석해 주요 색상을 바로 쓸 수 있는 팔레트(디자인에 넣을 수 있는 hex 코드)로 반환합니다. 브랜드를 사진에 맞추거나, 무드보드를 만들거나, 히어로 이미지에 맞춰 웹사이트 테마를 잡을 때 일일이 스포이드로 색을 따는 건 느리고 부정확합니다. 이 도구는 이미지 전체를 샘플링해 그 분위기를 정의하는 핵심 색상들로 묶어내며, 모든 처리는 브라우저에서 이루어집니다.

사용 방법 (단계별)

  1. 1

    이미지 올리기

    사진·로고·스크린샷·일러스트 모두 가능합니다. 고해상도일수록 대표성 높은 팔레트가 나옵니다.

  2. 2

    추출된 팔레트 확인

    주요 색과 강조색이 hex·RGB 값과 함께 표시됩니다.

  3. 3

    필요한 코드 복사

    스와치를 클릭해 hex를 복사하고, CSS·디자인 도구·브랜드 가이드에 넣으세요.

작동 원리

이미지를 캔버스에 그려 픽셀을 RGB 값으로 읽습니다. 클러스터링 알고리즘(median-cut 또는 k-means 계열)이 수백만 픽셀을 등장 빈도로 가중한 대표 색상들로 묶습니다. 결과는 주요 팔레트와 강조색이며, 각각 복사 가능한 hex·RGB 코드로 표시됩니다. 원시 픽셀 데이터를 로컬에서 처리하므로 원본 이미지는 업로드되지 않습니다.

이럴 때 쓰세요

선택한 사진과 어울리는 웹사이트·슬라이드 테마 구성. 로고 이미지에서 브랜드 색 추출. 일러스트·UI 목업용 조화로운 팔레트 제작. 영감 사진으로 무드보드 생성. 제품 사진에서 접근성 좋은 텍스트·배경 조합 선정. 히어로 이미지 톤에 맞춘 CSS 그라데이션 매칭.

자주 묻는 질문

압도적이지 않으면서 쓸 만한 팔레트를 만들 만큼의 주요 색과 강조색 몇 개입니다. 미묘한 그라데이션 사진은 평면 색 블록 그래픽보다 더 적은 수의 색으로 묶입니다.

이미지 색상 추출기 | Super Easy Utils