이미지 좌표 추출기

100% | 클릭→←↑↓→ 1px 조정→Enter 확정 · Space+드래그 이동 x-   y-

색 경계의 정확한 픽셀 좌표 찾기

파란 아이콘과 검은 배경의 경계 픽셀 좌표를 추출하는 화면 1 2 3
  1. 1파란 아이콘과 검은 배경이 만나는 지점을 클릭합니다.
  2. 2루페의 픽셀 격자와 십자선으로 정확한 경계를 맞춥니다.
  3. 3Enter로 확정하면 x·y 값과 파일명이 좌표 목록에 기록됩니다.

좌표를 원하는 코드 형식으로 복사하기

확정한 좌표를 define 매크로 형식으로 복사하는 화면123
  1. 1#define 프리셋을 선택합니다.
  2. 2{x}{y}가 들어간 두 줄 템플릿과 미리보기를 확인합니다.
  3. 3좌표 행을 클릭하면 실제 값이 들어간 매크로가 복사됩니다.
확정한 좌표를 함수 코드 형식으로 복사하는 화면123
  1. 1함수 프리셋을 선택합니다.
  2. 2함수 이름과 본문을 프로젝트 코드에 맞게 편집합니다.
  3. 3좌표 행을 클릭한 뒤 복사 완료 메시지로 결과를 확인합니다.
사용자 템플릿으로 파일명 번호 x y 좌표를 조합해 복사하는 화면123
  1. 1{n}, {x}, {y}, {file}을 조합해 원하는 포맷을 작성합니다.
  2. 2미리보기에서 실제 치환 형태를 먼저 확인합니다.
  3. 3좌표 행을 클릭하면 완성된 문자열이 즉시 복사됩니다.

이미지 좌표 추출기란

화면 캡처나 UI 목업 위의 특정 지점이 픽셀 단위로 어디에 있는지를 알아야 할 때가 있습니다. 버튼의 중심, 아이콘의 모서리, 텍스트가 시작하는 위치처럼 “여기가 x 몇, y 몇인가”를 눈대중이 아니라 정확한 좌표로 얻어야 하는 상황이죠. 이 도구는 이미지를 불러와 원하는 지점을 클릭하면 그 자리의 x, y 좌표를 바로 뽑아 주고, 방향키로 1픽셀씩 다듬어 정밀하게 맞출 수 있게 해 줍니다.

불러온 이미지는 브라우저 안에서만 열리고 어떤 서버로도 업로드되지 않습니다. 회사 내부 화면이나 공개되지 않은 디자인 시안을 다뤄도 파일이 밖으로 나가지 않으므로 안심하고 쓸 수 있습니다.

이렇게 씁니다

좌표를 코드 형식으로 복사

이 도구의 강점은 좌표를 단순 숫자가 아니라 바로 쓸 수 있는 형태로 복사한다는 점입니다. 좌표 목록의 행을 클릭하면 설정한 포맷대로 클립보드에 자동으로 들어갑니다. 기본 제공 프리셋은 x:123 y:45 같은 좌표형, #define 매크로형, 그리고 함수 호출형이며, 치환자 {x} {y} {n}(번호) {file}(파일명)을 조합해 여러 줄 템플릿도 직접 만들 수 있습니다. HMI·임베디드 UI에서 위젯 좌표를 소스에 박아 넣는 작업, 게임·자동화 스크립트의 클릭 위치 지정, 웹 개발에서 요소 위치 확인 등에 그대로 활용됩니다.

지원 포맷과 한계

PNG·JPG·BMP·GIF·WebP 등 브라우저가 여는 일반 이미지 포맷을 불러올 수 있습니다. 좌표는 언제나 이미지 원본 픽셀 기준이라, 화면에서 확대·축소해 보고 있어도 실제 파일 해상도 상의 정확한 위치가 나옵니다. 다만 이 도구는 좌표를 추출·복사하는 데 특화되어 있어 이미지 자체를 수정하거나 저장하지는 않습니다. 색 값이 필요하면 색상 추출기를, 크기 변경이 필요하면 이미지 리사이즈를 함께 쓰면 됩니다.

자주 묻는 질문

좌표의 원점(0,0)은 어디인가요?

이미지의 왼쪽 위 모서리가 (0, 0)이며, x는 오른쪽으로, y는 아래로 커집니다. 대부분의 화면·UI 좌표계와 같은 방식입니다.

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

아니요. 파일은 브라우저 안에서만 열리고 네트워크로 전송되지 않습니다. 보안이 중요한 화면 캡처도 안전하게 다룰 수 있습니다.

여러 장을 한 번에 작업할 수 있나요?

네. 여러 이미지를 불러오면 왼쪽 목록에서 방향키로 넘겨 가며 각각 좌표를 찍을 수 있고, 각 좌표에는 어느 파일에서 나왔는지가 함께 기록됩니다.

한 번 정한 복사 포맷은 유지되나요?

네. 설정한 템플릿은 브라우저에 저장되어 다음에 다시 열어도 그대로 남아 있습니다.