색상 추출

이미지에서 색 뽑기 · HEX·RGB·HSL·CMYK 변환 · 대비 확인

이미지에서 색 뽑기
이미지를 올리고 원하는 지점을 누르면 그 자리의 색을 읽습니다. 파일은 서버로 전송되지 않고 브라우저 안에서만 처리됩니다.
직접 고르기
결과 — 눌러서 복사
HEX-
RGB-
HSL-
CMYK-
밝기 (상대휘도)-
흰 글자 대비-
검은 글자 대비-
보색-
어울리는 색
색상환에서 규칙적으로 떨어진 색들입니다. 눌러서 복사할 수 있습니다.
자주 묻는 질문
올린 이미지가 서버로 전송되나요?
아닙니다. 이미지는 브라우저 안에서만 처리되고 어디로도 전송되지 않습니다. 페이지를 닫으면 사라집니다.
HEX·RGB·HSL·CMYK는 뭐가 다른가요?
같은 색을 다르게 표기하는 방식입니다. HEX와 RGB는 웹과 화면에서, HSL은 색상·채도·명도를 따로 조절할 때, CMYK는 인쇄에서 씁니다. 화면 색을 그대로 인쇄하면 달라 보일 수 있는데, 표현 가능한 색 범위가 다르기 때문입니다.
대비 비율은 왜 표시되나요?
배경색 위에 글자를 올릴 때 읽히는지 판단하려고 표시합니다. 웹 접근성 기준으로 본문 글자는 4.5:1 이상, 큰 글자는 3:1 이상이 필요합니다. 흰 글자와 검은 글자 중 어느 쪽이 잘 보이는지 바로 비교할 수 있습니다.
보색과 유사색은 어떻게 정해지나요?
색상환에서 각도로 정합니다. 보색은 180도 반대편, 삼각 배색은 120도씩 떨어진 색, 유사색은 30도 이내의 이웃한 색입니다. 채도와 명도는 그대로 두고 색상만 돌립니다.
스크린샷에서도 색을 뽑을 수 있나요?
됩니다. 화면을 캡처해 이미지로 저장한 뒤 올리고 원하는 지점을 누르면 됩니다. 다만 캡처 과정에서 색 프로파일이 변환되면 원본과 미세하게 다를 수 있습니다.
복사는 어떻게 하나요?
결과 칸이나 팔레트 색을 누르면 클립보드에 복사됩니다. 테두리가 잠깐 강조되면 복사된 것입니다.
광고 영역

같은 색인데 표기가 네 개인 이유

HEX, RGB, HSL, CMYK는 모두 같은 색을 가리키지만 쓰임새가 다릅니다. HEX와 RGB는 화면에서 빛을 더해 색을 만드는 방식이고, CMYK는 잉크를 겹쳐 빛을 빼는 방식입니다. 그래서 화면에서 선명하게 보이던 색이 인쇄하면 탁해지는 일이 생깁니다. 특히 형광에 가까운 초록이나 파랑은 인쇄로 재현되지 않습니다.

HSL이 편할 때가 있습니다

색을 조금 밝게, 조금 흐리게 조정하려면 RGB는 세 숫자를 동시에 만져야 합니다. HSL은 색상·채도·명도가 분리돼 있어 밝기만 올리거나 채도만 낮추기 쉽습니다. 이 페이지의 팔레트도 색상만 각도로 돌려 만든 것입니다.

배경색을 정할 때는 대비를 먼저 보세요

예쁜 배경색을 골랐는데 글자가 읽히지 않는 일이 흔합니다. 대비 비율은 배경과 글자의 밝기 차이를 수치로 나타낸 값이고, 웹 접근성 기준으로 본문은 4.5:1 이상을 권합니다. 이 도구는 고른 색 위에 흰 글자와 검은 글자를 올렸을 때의 대비를 함께 계산해 어느 쪽을 써야 할지 바로 알려줍니다. 색만 보고 정하면 나중에 다시 고치게 됩니다.

공유하기