컬러 테마 생성기

홈으로 돌아가기
이미지 파일을 추가하세요 — 또는 여기로 드래그
JPG PNG WEBP HEIC

컬러 테마 생성기에 관하여

사진에서 팔레트를 뽑는 것은 색 배합에 이르는 가장 빠르고 정직한 방법입니다. 좋은 사진 속 색들은 이미 서로 어울립니다. 같은 빛 아래서 같은 센서로 담겼기 때문이죠. 디자이너들은 사진이 존재해 온 만큼 오래 이 방식으로 배합을 만들어 왔습니다.

이 도구는 어떤 이미지에서든 최대 여섯 가지 색을 추출합니다. 그림을 작은 표본으로 줄이고, 모든 픽셀을 거친 색 구간에 넣고, 구간을 픽셀 수로 정렬한 뒤, 그 순위를 훑으며 이미 고른 색들과 충분히 떨어진 색만 선택합니다. 마지막 단계 덕분에 해변 사진에서 베이지 여섯 가지가 나오는 일이 없습니다.

분석은 축소된 사본으로 브라우저에서 실행됩니다. 업로드도 없고 팔레트가 어딘가 저장되지도 않습니다.

컬러 팔레트를 추출하는 방법

  1. 이미지를 추가합니다. 사진, 일러스트, 디자인 스크린샷 등 가져올 만한 색이 있는 것이면 됩니다.
  2. 색상 견본을 봅니다. 최대 여섯 색이 hex 코드와 함께 나타나며, 이미지에서 차지하는 비중 순으로 정렬됩니다.
  3. 클릭해서 복사합니다. 견본을 클릭하면 hex 코드가 바로 클립보드에 복사됩니다.
  4. 팔레트를 내려받습니다. 다운로드 버튼으로 견본을 라벨이 붙은 PNG로 저장해 기획서나 무드보드에 넣을 수 있습니다.

색을 고르는 방식

단계내용
축소이미지를 긴 변 80픽셀로 줄임
구간화각 픽셀을 거친 색 구간에 배정
정렬구간을 담긴 픽셀 수로 정렬
분리이미 고른 색과 너무 가까운 후보는 건너뜀
평균선택된 구간이 자기 픽셀들의 실제 평균값을 보고

먼저 축소하는 것은 의도적입니다. 센서 노이즈와 JPEG 아티팩트를 평균으로 지워 주는데, 그러지 않으면 거의 똑같은 색 수천 개가 생겨 순위가 무의미한 변주로 뒤덮입니다.

여섯 색을 쓸 만한 배합으로 만들기

추출된 팔레트는 완성된 체계가 아니라 원재료입니다. 이미지에서 가장 큰 비중을 차지하는 색은 대개 배경이 되고, 가장 작고 채도가 높은 색은 대개 강조색이며 강조색으로 남겨두어야지 배경이 되면 안 됩니다.

확정 전에 반드시 대비를 확인하세요. 사진 안에서 나란히 아름다워 보이는 두 색이, 본문 글자가 배경에 대해 필요로 하는 4.5:1 비율 근처에도 못 미치는 경우가 많습니다. 사진에는 서로 너무 가까운 중간 톤이 가득하므로 추출 팔레트는 특히 이 문제에 취약합니다.

자주 묻는 질문

몇 가지 색이 추출되나요?

최대 여섯 가지입니다. 이미지에 충분히 구별되는 색이 여섯 개 없으면 더 적게 나옵니다. 단색조 사진이라면 세 개일 수도 있습니다.

이미지에 있는 색과 정확히 같지 않은 이유는?

각 견본이 한 픽셀을 찍은 값이 아니라 비슷한 픽셀 무리의 평균이기 때문입니다. 하이라이트나 압축 아티팩트에 걸릴 수 있는 임의의 한 점보다 더 대표성 있는 색이 나옵니다.

어떤 색을 뽑을지 지정할 수 있나요?

아니요. 각 색이 이미지에서 차지하는 비중과, 이미 선택된 색들과 얼마나 다른지에 따라 자동으로 선택됩니다. 결과에 영향을 주고 싶다면 원하는 영역만 먼저 잘라내세요.

hex 코드를 어떻게 쓰나요?

견본을 클릭하면 코드가 클립보드에 복사되므로 CSS, 디자인 도구, 브랜드 문서에 붙여넣으면 됩니다. 다운로드하면 여섯 색이 라벨과 함께 이미지 한 장으로 저장됩니다.

이 팔레트가 접근성을 만족하나요?

반드시 그렇지는 않습니다. 이 도구는 대비 기준이 아니라 시각적으로 구별되는 색을 고릅니다. 배포 전에 글자와 배경 조합을 대비 검사기로 확인하세요.

이미지가 업로드되나요?

아니요. 분석은 브라우저 안에서 축소된 사본으로 실행되며 전송되는 것은 없습니다.

관련 도구