사진 색상 추출 · 이미지에서 색상 코드 뽑기
사진이나 로고에서 가장 많이 쓰인 색을 골라 HEX·RGB 코드와 비율로 보여 줍니다. 그림을 클릭하면 그 자리의 색을 집고, 팔레트를 PNG나 CSS 변수로 저장할 수 있습니다.
🔒 사진이 서버로 업로드되지 않습니다사진을 클릭하면 그 자리 색을 집습니다. 아래 색 칸을 누르면 HEX 코드가 복사됩니다.
뽑은 코드를 색상 코드 변환에 넣으면 HSL·CMYK로 바꾸고 글자색과의 명도 대비를 검사할 수 있습니다. 사진의 일부만 쓰려면 먼저 이미지 자르기로 잘라 올리세요.
어디에 쓰나
브랜드 색 알아내기 — 로고 파일만 있고 색상 코드를 모를 때. 디자이너에게 "이 색으로"라고 정확히 전달할 수 있습니다.
사진에 맞는 배경·글자색 — 썸네일이나 카드뉴스에 사진을 넣을 때 사진에서 뽑은 색을 배경으로 쓰면 어색하지 않습니다.
인테리어·패션 참고 — 마음에 드는 사진의 색 조합을 코드로 받아 두면 비슷한 분위기를 다시 만들 수 있습니다.
웹·앱 테마 — "CSS 변수로 복사"는 --color-1: #…; 형태로 바로 붙여 넣을 수 있습니다.
색을 고르는 방식
사진의 모든 픽셀을 색 공간에서 상자 하나로 보고, 가장 넓게 퍼진 축의 가운데에서 둘로 나누는 일을 원하는 개수가 될 때까지 반복합니다(미디언 컷). 각 상자의 평균이 대표색이 되고, 상자에 든 픽셀 수가 비율입니다. 그래서 면적이 작은 강조색은 개수를 늘려야 나타나고, 그라데이션 사진은 비슷한 색이 여럿 나올 수 있습니다. 특정한 한 점의 정확한 색이 필요하면 그림을 직접 클릭하세요 — 그 자리 원본 픽셀의 값을 그대로 보여 줍니다.
자주 묻는 질문
사진이 서버로 올라가나요?
아니요. 색을 세는 일은 브라우저 안에서만 이뤄지고 사진은 어디로도 가지 않습니다. 인터넷을 끊어도 동작합니다.
로고의 정확한 색이 조금 다르게 나와요
대표색은 비슷한 색의 평균이라 JPG 압축 노이즈나 가장자리의 번짐이 섞여 몇 단계 어긋날 수 있습니다. 정확한 값은 로고의 평평한 부분을 클릭해 집으세요. 그 자리 픽셀 값을 그대로 보여 줍니다. PNG·SVG 원본이 있으면 그쪽이 더 정확합니다.
흰 배경이 1등으로 나와요
배경이 사진의 대부분이면 당연히 비율이 가장 큽니다. "흰·검 배경 빼기"를 켜면 거의 흰색·거의 검정인 픽셀을 세지 않아 물건 색만 남습니다.
비율 숫자는 무엇인가요?
그 색으로 분류된 픽셀이 전체에서 차지하는 비율입니다. 배경 빼기를 켰다면 남은 픽셀 기준입니다.
큰 사진도 되나요?
됩니다. 색을 셀 때는 사진을 작게 줄여서 세므로 수천만 픽셀 사진도 금방 끝납니다. 클릭으로 집는 색은 원본 해상도 기준입니다.