🔍 이미지 색상 추출 컬러피커

선택한 이미지는 이 브라우저 안에서만 처리되며 서버로 전송되지 않습니다. 업로드도 저장도 하지 않습니다.

이미지 파일 선택

뽑은 색

번호	좌표 x, y	HEX	RGB	알파

HEX 목록 (직접 선택해 복사할 수 있습니다)

이미지에서 색을 직접 찍어 가져오기

참고 사진이나 캡처 화면에 쓰고 싶은 색이 있을 때, 눈으로 보고 손으로 HEX를 적으면 거의 어긋납니다. 이 페이지는 이미지 파일을 고른 뒤 원하는 지점을 누르면 그 픽셀의 HEX·RGB·알파 값을 목록에 담아 줍니다. 여러 지점을 이어서 눌러 팔레트처럼 모을 수 있고, 모은 HEX 목록은 복사 버튼이나 아래 텍스트 칸에서 그대로 가져갈 수 있습니다.

처리 방식과 개인정보

고른 이미지는 브라우저의 FileReader로 읽어 화면의 canvas 요소에 그린 다음, 누른 좌표의 픽셀 한 개를 getImageData로 읽습니다. 모든 처리가 이 브라우저 안에서 끝나므로 이미지가 서버로 전송되지도, 저장되지도 않습니다. 외부 라이브러리를 쓰지 않습니다. 큰 이미지는 화면에 맞게 가로 640px까지 줄여 그리므로, 표에 적히는 좌표는 원본 크기가 아니라 표시된 크기 기준입니다. 2026년 10월 기준 브라우저 표준 기능만 씁니다.

한계

줄여 그린 이미지에서 색을 읽기 때문에 1픽셀 단위 원본 값이 필요하면 원본 크기로 잘라낸 파일을 쓰세요. 사진 전체에서 주요 색 몇 개를 자동으로 뽑아 주는 기능은 지원하지 않으며, 누른 지점의 픽셀만 읽습니다. 반투명 픽셀은 알파 값을 따로 알려 주지만 HEX 코드에는 투명도가 들어가지 않습니다.

자주 묻는 질문

이미지가 서버로 올라가나요?

올라가지 않습니다. FileReader와 canvas로 브라우저 안에서만 읽고 그리며, 네트워크로 파일을 보내는 코드가 없습니다. 페이지를 닫으면 읽어 둔 내용도 함께 사라집니다.

사진에서 주요 색을 자동으로 뽑아 주나요?

아니요, 자동 추출은 지원하지 않습니다. 누른 지점의 픽셀 한 개만 읽습니다. 여러 색이 필요하면 원하는 지점을 차례로 눌러 목록에 모으세요.

좌표가 원본 픽셀과 다르게 나옵니다.

큰 이미지는 가로 640px까지 줄여서 그리기 때문입니다. 표의 좌표는 표시된 크기 기준이며, 원본 좌표가 필요하면 원본 크기로 잘라낸 파일을 올려 쓰세요.

🔍이미지에서 색상 추출 컬러피커 가이드

관련된 도구

HEX/RGB/HSL 컬러 변환기

색상 명암(Tint·Shade) 단계 생성기

이미지에서 색을 직접 찍어 가져오기

처리 방식과 개인정보

한계

자주 묻는 질문

관련된 도구

HEX/RGB/HSL 컬러 변환기

색상 명암(Tint·Shade) 단계 생성기

이미지에서 색을 직접 찍어 가져오기

처리 방식과 개인정보

한계

자주 묻는 질문

같은 카테고리 도구