이미지 팔레트 추출
Extract dominant colors, HEX codes, and reusable palette tokens from local images before design review or frontend handoff.
브라우저 로컬 처리. 업로드 없음.
파일을 드롭하거나 클릭하여 찾아보세요
파일을 기다리는 중
시작하려면 파일을 추가하세요.
원본
-
Colors found
-
Dominant color
-
브라우저 로컬 처리. 업로드 없음.
Extracted palette
파일을 기다리는 중
CSS variables
:root {
}Palette JSON
[]
팔레트 샘플링 방식
이미지는 작은 캔버스에 그려지고, 픽셀이 읽히고, 색상이 그룹화되어 지배적인 색상이 상위로 올라옵니다. 축소된 복사본에서 샘플링하는 것은 의도적입니다. 4천만 화소 사진도 빠르게 분석할 수 있고, 한쪽의 노이즈 많은 모서리가 결과를 지배하는 것을 막습니다. 모든 과정이 로컬에서 실행되므로 브랜드 자산과 미공개 아트워크는 절대 업로드되지 않습니다.
스타일시트나 디자인 토큰 파일에 바로 붙여넣을 수 있는 헥스 코드를 얻을 수 있습니다.
추출한 팔레트 읽기
추출된 색상은 완성된 시스템이 아니라 시작점입니다. 사진의 지배적인 색상은 사진적입니다. 즉, 해당 특정 이미지의 조명과 분위기를 담고 있으며, 이는 사용 가능한 인터페이스 팔레트에 필요한 것과 종종 반대입니다. 출력을 이미지가 포함하는 것에 대한 증거로 취급한 다음, 접근 가능한 조합을 의도적으로 선택하세요.
출시 전에 대비를 확인하세요. 스와치 행에서 보기 좋은 색상 조합도 본문 텍스트의 가독성 임계값을 통과하지 못할 수 있으며, 버튼 레이블 색상으로 사용된 추출된 악센트 색상은 배경 대비 충분한 대비를 갖지 못할 수 있습니다.
추출이 잘못된 도구일 때
목표가 기존 브랜드 시스템과 일치시키는 것이라면 무작위 사진이 아니라 브랜드 파일에서 샘플링하세요. 목표가 전체 디자인 시스템이라면 추출은 색조를 제공하지만 실제로 필요한 틴트, 셰이드, 간격, 의미론적 역할은 제공하지 않습니다. 결정을 내리는 데 사용하지 말고 결정에 정보를 제공하는 데 사용하세요.
빠른 팁
- Use 4-6 colors for UI token handoff and 8 colors for richer moodboards.
- The palette is sampled locally from a downscaled preview so large files stay fast.
다음 단계: 정지 사진을 영상으로
위 도구는 모두 브라우저에서 실행되며 비용이 들지 않습니다. 파일이 준비되면 Animate AI가 이어받습니다. 사진 한 장을 올리고 동작 프리셋을 고르면 짧은 영상이 만들어집니다. 크레딧은 선불이라 시작 전에 정확한 가격을 확인할 수 있습니다.
Animate AI에서 다음에 볼 페이지
각 워크플로, 브라우저 도구, 요금 안내는 모두 별도 페이지입니다. 지금 가진 소재에 맞는 페이지부터 열어 보세요.