이미지 색상 추출기의 주요 기능
이미지 색상 추출기는 사용자의 기기에서 이미지를 불러온 후, 이미지의 특정 픽셀을 선택하여 해당 위치의 정확한 색상 값을 확인할 수 있는 도구입니다. 정밀한 픽셀 선택을 돕기 위해 확대된 돋보기 보기를 제공하며, 색상을 선택하면 해당 픽셀의 HEX, RGB, HSL 값이 화면에 표시됩니다. 또한, 여러 개의 색상을 선택하여 보관함에 저장할 수 있으며, 저장된 색상 값을 클릭하여 다른 곳에 붙여넣을 수 있도록 복사하는 기능을 지원합니다.
지원하는 이미지 파일 형식
이 도구는 단 하나의 이미지 파일을 불러와 작업을 수행합니다. 지원하는 파일 형식 및 MIME 타입은 다음과 같습니다:
- PNG (
image/png) - JPG (
image/jpeg) - WebP (
image/webp) - GIF (
image/gif) - AVIF (
image/avif) - HEIC (
image/heic,image/heif)
만약 지원하지 않는 파일 형식을 드롭하면 "지원되지 않는 파일 형식입니다. PNG, JPG, WebP, GIF, AVIF 또는 HEIC 이미지를 사용해 주세요."라는 메시지가 표시됩니다. 손상되었거나 열 수 없는 이미지의 경우에는 "이미지를 열 수 없습니다. 파일이 손상되었거나 지원되지 않는 형식일 수 있습니다."라는 오류 메시지가 나타납니다.
색상 추출 및 조작 방법
이미지를 불러오면 도구는 즉시 이미지 중앙에 위치한 픽셀의 색상 값과 좌표를 화면에 표시합니다.
- 마우스 조작: 이미지 위로 포인터를 이동하면 픽셀 단위로 색상이 실시간 추출되며, 마우스로 이미지를 클릭하면 현재 추출된 색상이 보관함에 저장됩니다.
- 키보드 조작: 키보드의 방향키를 사용하여 이미지 위의 조준선을 움직이면서 색상을 추출할 수 있습니다. 이때 Shift 키를 누른 상태로 방향키를 움직이면 조준선이 10픽셀 단위로 빠르게 이동합니다. 원하는 위치에서 Enter 키나 Space 키를 누르면 해당 색상이 저장됩니다.
- 이미지 크기 제한: 이미지의 가장 긴 변이 4096픽셀을 초과하는 경우에는 도구 내부에서 이미지를 축소하여 처리합니다.
- 초기화: "다시 시작" 버튼을 누르면 불러온 이미지가 제거되고, 저장된 색상 보관함이 비워지며 도구가 처음 상태로 재설정됩니다.
색상 값 출력 및 복사 규칙
색상을 추출하면 화면에 다음과 같은 정보가 출력됩니다:
- 크기: 불러온 이미지의 가로 및 세로 차원입니다.
- 픽셀: 현재 추출 중인 픽셀의 좌표입니다.
- HEX, RGB, HSL: 해당 픽셀의 색상 코드 값입니다. 이 값들 중 하나를 클릭하면 클립보드에 바로 복사됩니다. 만약 브라우저가 클립보드 접근을 제한하는 경우 "복사할 수 없습니다. 브라우저에서 클립보드 접근을 차단했습니다."라는 메시지가 표시됩니다.
- 알파 채널(투명도): 선택한 픽셀이 반투명한 경우 "알파
{n}% — 이 픽셀은 부분적으로 투명합니다."라는 문구가 표시됩니다. 이때 도구는 배경에 무엇이 있는지와 관계없이 해당 픽셀 자체에 저장된 순수한 색상 값만을 읽어 들입니다. - 보관함 저장: 색상을 저장하면 "
{hex}색상을 보관함에 저장했습니다."라는 안내가 나타나며, "저장한 색상이 여기에 표시됩니다. 색상 견본을 클릭하면 다시 불러올 수 있습니다." 영역에 기록됩니다. 보관함에는 최대 12개의 색상까지 저장할 수 있으며, RGB 값이 같더라도 알파(투명도) 값이 다르면 서로 다른 색상으로 인식하여 별도로 저장됩니다.
이미지 압축과 픽셀 값의 관계
이 도구는 이미지 파일 내부에 저장된 정확한 픽셀 값을 그대로 읽어와 표시합니다. 하지만 원본 이미지의 종류에 따라 사용자가 눈으로 보는 색상과 추출된 값이 다를 수 있습니다.
예를 들어, JPEG 형식의 이미지나 스크린샷 파일의 경우 이미지 압축 과정이나 안티앨리어싱(경계선을 부드럽게 처리하는 기술)이 적용되면서 미세하게 픽셀 값이 왜곡되거나 변경되었을 수 있습니다. 따라서 정확한 색상 추출이 필요할 때는 압축 손실이 없는 원본 파일을 사용하는 것이 좋습니다.
개인정보 보호 및 데이터 처리
이 도구는 사용자의 프라이버시를 안전하게 보호합니다. 불러오는 이미지는 사용자의 기기에서 직접 읽어 들이며 브라우저 외부로 절대 전송되지 않습니다. 모든 작업은 사용자의 브라우저 내에서 로컬로 처리되며, BroBroGo 서버로 어떠한 이미지 데이터도 업로드되지 않습니다.
자주 묻는 질문 (FAQ)
Q. 이미지에서 색상을 어떻게 추출하나요?
A. 이미지 위로 포인터를 가져가면 패널에 해당 위치의 색상이 표시되며, 돋보기 창이 확대되어 정확한 픽셀을 선택할 수 있도록 도와줍니다. 클릭하면 해당 색상이 보관함에 저장됩니다. 키보드를 사용해 이미지에 포커스를 맞춘 후 방향키로 조준선을 이동하고 Enter 키를 눌러 선택할 수도 있습니다.
Q. 어떤 색상 형식을 지원하나요?
A. 추출하는 모든 픽셀의 색상이 HEX, RGB, HSL 형식으로 동시에 표시됩니다. 원하는 값을 클릭하면 바로 복사되어 CSS나 디자인 도구에 바로 붙여넣을 수 있습니다.
Q. 추출한 색상이 예상과 가끔 다른 이유는 무엇인가요?
A. 이미지에 저장된 정확한 픽셀 값을 추출합니다. JPEG 파일이나 스크린샷의 경우, 압축 및 안티앨리어싱(경계선 부드럽게 처리)으로 인해 주변 픽셀이 미세하게 변했을 수 있습니다. 또한 반투명 픽셀은 뒤에 있는 배경색을 제외한 해당 픽셀 자체의 값만 읽습니다.