휴패드: 동영상을 원하는 프레임에서 멈추고 돋보기로 픽셀을 눌러 정확한 색 값을 복사하는 스포이드

휴패드는 이런 도구입니다

휴패드는 동영상 프레임과 이미지에서 색을 고르는 컬러 피커(스포이드)입니다. 영상을 열어 원하는 프레임에서 정확히 멈추고 돋보기로 픽셀을 고르면 HEX, RGB, HSL, OKLCH, CMYK 값이 나와 디자인 파일, 스타일시트, 색 보정 메모에 바로 복사할 수 있습니다. 저장한 색은 파일 이름과 프레임 시간을 함께 기억해, 나중에도 어디서 온 색인지 알 수 있습니다.

모든 일은 이 기기에서 일어납니다. 동영상이나 이미지는 이 브라우저 안에서만 읽고 아무것도 업로드하지 않습니다. 설치도 계정도 필요 없고 무료이며, 도구 안에 광고가 없습니다. 한국어·영어·일본어·독일어를 지원하고, 카메라는 쓰지 않습니다.

동영상 열기

‘동영상·이미지 고르기’ 버튼을 누르거나, 페이지 어디든 파일을 끌어다 놓거나, 복사한 파일이나 스크린샷을 붙여 넣으세요. 다음 파일은 ‘다른 파일 열기’ 버튼으로 엽니다.

• 동영상: MP4(H.264), WebM, MOV, 그 밖에 이 브라우저가 재생하는 형식. 이미지: PNG, JPG, WebP, GIF(움직이는 GIF는 첫 프레임).
• 동영상이 재생되지 않으면 이 브라우저가 그 형식이나 코덱을 지원하지 않는 것입니다. HEVC(H.265)와 일부 MOV 파일은 브라우저에 따라 열리지 않습니다. MP4(H.264)로 변환하거나 Safari, Chrome 같은 다른 브라우저로 열어 보세요.
• iPhone에서는 첫 프레임이 보이기 전에 한 번 눌러야 할 수 있습니다. 그때는 ‘눌러서 첫 프레임 보기’ 안내를 누르세요.

스크럽과 한 프레임씩 넘기기

• ‘재생’·‘일시정지’ 버튼, 원하는 곳으로 바로 가는 스크러버, 정확히 한 프레임씩 움직이는 ‘이전 프레임’·‘다음 프레임’ 버튼이 있습니다.
• 프레임 속도는 재생하는 동안 영상에서 알아냅니다. 아직 모를 때는 1/30초씩 넘깁니다.
• 시간은 mm:ss.mmm(분:초.밀리초) 형식으로 프레임 번호와 함께 나오므로, 같은 프레임을 다시 찾을 수 있습니다.

돋보기로 픽셀 고르기

• 컴퓨터에서는 픽셀을 클릭합니다. 포인터를 그림 위에 올리면 먼저 돋보기가 보입니다.
• 휴대폰에서는 손가락을 대고 끄세요. 돋보기가 손가락 위에 떠서 픽셀을 가리지 않고, 손을 떼면 그 색이 골라집니다. 두 손가락으로 확대하고 옮깁니다.
• 확대·축소 버튼으로 크게 보고, ‘맞춤’ 버튼으로 프레임 전체를 다시 봅니다.
• 키보드: 화살표 키는 1픽셀, Shift와 화살표는 10픽셀 움직이고, Enter는 색을 저장합니다.

색 값과 복사

‘고른 색’ 칸에 HEX, RGB, HSL, OKLCH, CMYK 다섯 가지 값이 나옵니다. 줄을 누르면 그 값이 복사됩니다. 대략적인 색 이름도 함께 보여 주는데, 표준 이름이 아니라 참고용입니다.

저장한 색 목록

• ‘색 저장’ 버튼을 누르면 고른 색이 ‘이 기기에 저장한 색’ 목록에 들어갑니다. 색 칩마다 파일 이름과, 동영상이라면 프레임 시간이 함께 남습니다.
• ‘HEX 모두 복사’ 버튼은 저장한 HEX 값을 한 번에 복사합니다.
• 색 하나는 칩의 ×로, 전부는 ‘모두 지우기’ 버튼으로 지웁니다. 두 경우 모두 잠시 ‘되돌리기’ 버튼이 나옵니다.
• 목록에는 색을 2,000개까지 저장할 수 있습니다.

프레임 팔레트

‘이 프레임의 색’ 칸은 지금 프레임의 대표 색을 미디언 컷으로 찾습니다. ‘색 개수’ 설정에서 5~15개 가운데 고르고(처음은 8개), 색마다 프레임에서 차지하는 비율이 나옵니다. 색을 누르면 값이 나오고, ‘모두 내 색에 저장’ 버튼으로 팔레트 전체를 저장합니다.

내보내기: CSS, Tailwind, JSON, PNG

‘내보내기…’ 버튼으로 저장한 색을 네 가지 형식 가운데 하나로 바꿉니다: ‘CSS 변수’, ‘Tailwind 설정’, ‘JSON’, ‘PNG 색상 띠’. ‘복사’ 버튼은 글을 클립보드에 넣고, ‘내려받기’ 버튼은 파일로 저장합니다.

이미지 파일

스크린샷, 사진, 디자인 시안 이미지도 같은 방법으로 엽니다: 같은 ‘동영상·이미지 고르기’ 버튼, 끌어다 놓기, 붙여 넣기. 이미지에는 프레임 넘기기 버튼이 없을 뿐, 돋보기, 값, 팔레트, 내보내기는 똑같습니다. 움직이는 GIF는 첫 프레임을 보여 줍니다.

명암비(WCAG)

‘명암비(WCAG)’ 칸은 고른 색과 흰 바탕, 검은 바탕 사이의 명암비와 도달한 등급을 보여 줍니다. 일반 글자는 AA에 4.5, AAA에 7이 필요하고, ‘AA 큰 글자’ 등급(3 이상)은 24px(굵게 19px) 이상 글자에만 충분합니다.

값이 다를 수 있는 이유: 색 공간과 HDR

• 값은 이 브라우저가 sRGB로 디코딩한 결과입니다. HDR, 넓은 색영역(P3), 10비트, 로그 영상은 브라우저가 톤 매핑하므로 편집 프로그램이나 원본 파일의 값과 다를 수 있습니다.
• 손실 압축 영상(대부분의 MP4, WebM)은 경계 근처의 색이 조금 달라집니다. 경계에서 몇 픽셀 떨어진 고른 면에서 고르세요.
• 색은 화면에 줄여 보여 주는 미리보기가 아니라 원래 해상도의 프레임에서 읽습니다.
• 4096 × 4096 픽셀(약 1,680만 픽셀)을 넘는 아주 큰 그림은 이 브라우저가 안전하게 다룰 수 있는 크기로 줄인 사본에서 읽고, 화면에 그렇게 알려 줍니다.

백업 파일과 복원

• 저장한 색은 이 기기의 이 브라우저에만 있습니다. ‘백업 파일 저장’ 버튼으로 파일을 저장하고, 이 기기나 다른 기기에서 ‘파일에서 복원…’ 버튼으로 되살립니다. 복원할 때는 내 색에 더하거나(같은 색은 한 번만) 파일 내용으로 바꿉니다.
• 깨진 파일이나 팔레트 내보내기 파일은 아무것도 바꾸지 않습니다. 바뀐 것이 10번 쌓이거나, 백업하지 않은 변경이 있는 채로 7일이 지나면 백업하라고 알려 줍니다.

개인정보: 영상은 기기 밖으로 나가지 않습니다

동영상이나 이미지는 이 기기의 파일로 열어 이 브라우저 안에서만 읽습니다. 업로드하거나 다른 곳에 복사하거나 저장하지 않으며, 탭을 닫으면 사라집니다.

이 기기의 이 브라우저에 남는 것은 저장한 색뿐입니다: HEX 값, 저장한 때, 직접 고른 색인지 팔레트 색인지, 파일 이름, 프레임 시간과 번호, 그리고 팔레트 색 개수, 언어, 백업 알림 날짜. 계정이 없고, 페이지는 카메라·마이크·위치를 꺼 둡니다.

프레임패드와 다른 점

프레임패드는 실시간 카메라로 사진 구도를 코치하는 도구로, 카메라 화면을 보며 수평, 구도, 빛을 알려 줍니다. 휴패드는 카메라를 쓰지 않습니다. 이미 찍어 둔 동영상 파일과 이미지에서 한 프레임씩 색을 읽습니다.

• 프레임패드 가이드