이미지에서 색상 팔레트 만드는 법

좋은 팔레트는 마음에 드는 이미지 한 장에서 시작되곤 합니다. 콘셉트 아트, 영화 장면, 여행 사진. 그 색을 뽑으면 일러스트, UI, 픽셀 아트의 통일감 있는 출발점이 됩니다.

원리

이미지에서 색상 팔레트 추출은 이미지를 줄인 뒤, 사람 눈이 느끼는 밝기로 가중치를 준 k-평균 알고리즘으로 비슷한 색의 픽셀을 묶습니다. 각 색은 한 그룹의 평균색이고, 아래 퍼센트는 이미지에서 차지하는 비율입니다.

순서

  1. 이미지를 끌어다 놓습니다(브라우저 밖으로 나가지 않습니다).
  2. 색 수를 고릅니다. 5~6색은 분위기용, 12~16색은 픽셀 아트 작업용.
  3. 색을 클릭해 HEX 코드를 복사하거나 목록 전체를 복사합니다.
  4. CSS 변수로 내보내거나 GIMP·Aseprite·Krita·Inkscape용 .gpl을 받습니다.

더 좋은 팔레트를 위한 요령

  • 큰 여백이나 하늘이 대부분이라면 먼저 잘라 내세요.
  • 색 수를 바꿔 보세요. 6색 팔레트는 12색 팔레트의 일부가 아닙니다.
  • 나중에 다듬으세요. 추출한 색은 평균이라 탁해 보이기 쉽습니다. 포인트 색의 채도를 올리고 진짜 어두운색과 밝은색을 더하세요.

UI에 쓸 때

추출한 팔레트는 스타일 참고용이지 접근성을 갖춘 색 체계가 아닙니다. 글자색과 배경의 대비(일반 글자는 4.5:1 이상)를 확인하세요.

스프라이트 시트 분할은 스프라이트 시트 분할·합치기에서.

무료 도구 사용하기

다른 가이드