온라인 일괄 이미지 색상 추출 도구

주요 기능

이 도구는 이미지에서 정확한 픽셀 색상을 추출하여 디자인 작업에 바로 사용할 수 있는 팔레트를 만들어 줍니다. 예를 들어, 브랜드 로고 이미지에서 주요 색상을 추출하여 웹사이트 CSS 변수로 내보낼 수 있습니다.

작동 방식

이미지를 업로드하면 각 이미지가 최대 760x520 CSS 픽셀로 축소되어 표시됩니다. 이미지를 클릭하면 해당 지점의 픽셀 색상이 추출되어 팔레트에 추가됩니다. 팔레트 용량은 기본 10이며, 1~20 사이로 조절할 수 있습니다. 용량이 가득 차면 가장 오래된 색상이 제거됩니다.

내보내기 형식

각 이미지의 내보내기 대화상자에서 CSS, Code, SVG, PNG 형식을 선택할 수 있습니다. CSS는 CSS HEX, SCSS HEX, SCSS RGB 변수를 제공하며, Code는 쉼표로 구분된 HEX 값과 JSON 배열을 제공합니다. SVG와 PNG는 팔레트 그래픽으로 다운로드됩니다.

제한 사항

이 도구는 표시된 픽셀의 색상을 추출하므로, 지배적인 색상 계산, 유사 색상 병합, 중복 제거를 수행하지 않습니다. 또한 원본 이미지의 좌표를 내보내지 않습니다. 이미지가 25MB를 초과하거나 2,400만 픽셀을 초과하면 처리되지 않습니다.

체크리스트

• 최대 30개 이미지 일괄 처리
• 각 이미지별 독립 팔레트
• 클릭으로 색상 추출
• 용량 조절 (1~20)
• HEX, RGB, HSL 복사
• CSS, Code, SVG, PNG 내보내기

자주 묻는 질문

이미지에서 색상을 추출할 때 정확한 픽셀을 클릭해야 하나요?

네, 이미지를 클릭하면 해당 지점의 픽셀 색상이 추출됩니다. 이미지가 축소되어 표시되므로, 클릭하는 지점의 색상이 추출됩니다.

팔레트 용량을 늘리면 자동으로 색상이 추가되나요?

아니요, 용량을 늘려도 자동으로 색상이 추가되지 않습니다. 이미지를 클릭하여 색상을 직접 추가해야 합니다.

내보낸 CSS 변수는 어떻게 사용하나요?

CSS 내보내기에는 CSS HEX, SCSS HEX, SCSS RGB 변수가 포함됩니다. 이 변수들을 복사하여 프로젝트의 스타일시트에 붙여넣어 사용할 수 있습니다.