이미지 색상 추출 사용 방법
- 1사진, 로고, 스크린샷을 끌어다 놓거나 붙여넣으세요.
- 2색 개수 슬라이더로 뽑을 색을 2~16개 사이에서 정하세요.
- 3색 카드를 누르면 HEX 코드가 복사되고, 아래 rgb·hsl 값을 누르면 그 값이 복사돼요.
- 4이미지를 클릭하면 그 지점의 색이 직접 고른 색에 추가돼요.
- 5아래에서 CSS, SCSS, Tailwind, JSON, HEX 목록 중 하나를 골라 코드 복사를 누르거나 팔레트 PNG 다운로드를 누르세요.
주요 색과 비율
이미지의 픽셀을 분석해 비슷한 색끼리 묶고, 가장 넓게 쓰인 색부터 보여 줘요. 위쪽 막대의 너비가 각 색이 이미지에서 차지하는 비율이에요. 브랜드 로고의 정확한 색이 필요하다면 스포이트처럼 이미지를 직접 클릭해서 그 픽셀 색을 집으세요.
디자인·개발에 바로 쓰기
CSS 변수(--color-1), SCSS 변수, Tailwind 설정, JSON 형식으로 내보낼 수 있어서 웹 개발에 바로 붙여넣을 수 있어요. 팔레트 PNG는 색 띠와 HEX 코드가 함께 들어간 이미지라 디자인 시안이나 무드보드에 쓰기 좋아요.
자주 묻는 질문
사진에서 특정 부분의 색만 알 수 있나요?
네. 이미지 위에 마우스를 올리면 커서 아래 색이 표시되고, 클릭하면 직접 고른 색에 추가돼요.
색 코드는 어떤 형식으로 나오나요?
HEX(#2563eb), RGB, HSL 세 가지로 보여 주고, 각각 눌러서 복사할 수 있어요.
포토샵 없이 색을 뽑을 수 있나요?
네. 브라우저에서 이미지만 올리면 돼요. 설치나 회원가입이 필요 없어요.
이미지가 업로드되나요?
아니요. 색 분석은 내 브라우저 안에서만 이뤄져요.