💧 이미지 색상 추출기

소개

이미지 색상 추출기는 HTML Canvas API를 활용해 완전히 브라우저 안에서 동작합니다. 이미지를 불러오면 로컬 캔버스에만 그려지며, 파일은 기기 밖으로 나가지 않습니다. 화면에 맞게 축소된 이미지에서도 원본 해상도의 픽셀 데이터를 정확히 읽어 HEX·RGB 값을 제공합니다. 5×5 픽셀 확대경 그리드로 인접 색상을 정밀하게 구분할 수 있으며, Chrome·Edge에서는 화면 스포이드 기능도 지원합니다. 최근 추출한 색상 최대 24개는 브라우저 localStorage에 저장되어 새로고침 후에도 유지됩니다.

사용 방법

1. 업로드 영역에 이미지를 드롭하거나 '이미지 선택'을 클릭해 JPG, PNG, WebP, GIF, BMP 파일을 불러옵니다.
2. 이미지 위에서 커서를 움직이면 색상 미리보기, HEX 코드, RGB 값이 실시간으로 업데이트됩니다.
3. 이미지 아래의 5× 확대경 그리드로 개별 픽셀을 확대해 정확한 색상을 집어냅니다.
4. 이미지를 클릭하면 해당 색상이 히스토리에 저장됩니다. 최대 24개까지 보관되며, 스와치를 클릭하면 HEX 코드가 복사됩니다.
5. HEX·RGB 필드 옆의 '복사' 버튼으로 값을 바로 디자인 툴이나 코드 에디터에 붙여넣습니다.

자주 묻는 질문

이 도구는 완전 무료인가요?

네, 이미지 색상 추출기는 사용 횟수 제한 없이, 회원 가입 없이, 추가 비용 없이 완전 무료로 사용할 수 있습니다.

이미지가 서버에 업로드되나요?

전혀 아닙니다. 이미지는 HTML Canvas API를 사용해 브라우저 내에서만 처리됩니다. 어떤 서버에도 전송되지 않으므로 사진과 디자인 파일의 개인 정보가 완벽하게 보호됩니다.

인터넷 없이 오프라인으로 사용할 수 있나요?

네, 페이지를 한 번 불러온 후에는 인터넷 연결 없이도 사용할 수 있습니다. 모든 색상 추출이 브라우저 내에서 이루어지므로 비행 중이나 네트워크가 불안정한 환경에서도 유용합니다.

어떤 색상 형식을 출력하나요?

샘플링된 픽셀마다 HEX(예: #3a8fdf)와 RGB(예: rgb(58, 143, 223)) 형식으로 출력합니다. 두 값 모두 복사 버튼이 있어 CSS, Figma, 포토샵 등 디자인 툴에 바로 붙여넣을 수 있습니다.

어떤 이미지 형식을 지원하나요?

JPG, PNG, WebP, GIF, BMP 형식을 모두 지원합니다. 파일을 드래그 앤 드롭하거나 파일 선택기로 열 수 있습니다.