색상 선택기
색상을 고르고 세밀하게 조정한 뒤 필요한 형식의 코드를 복사하세요.
이 기기 안에서 봉인됨
브라우저에서 실행돼요. 아무것도 업로드되지 않아요.
봉인됨
색상 고르기
색상 코드
밝은 단계와 어두운 단계
한쪽은 더 밝은 단계, 다른 쪽은 더 어두운 단계예요. 하나를 선택해 사용하세요.
사용 방법
-
색상 고르기
색상 영역과 색조 슬라이더를 드래그하거나, 갖고 있는 코드를 입력하거나, 화면에서 색을 추출하세요.
-
세밀하게 조정하기
불투명도를 조정하거나 색상의 밝은 단계와 어두운 단계를 살펴보며 더 밝거나 어두운 변형을 찾으세요.
-
코드 복사하기
HEX, RGB, HSL, OKLCH, CMYK 값을 복사해 디자인, 코드, 문서에 붙여 넣으세요.
자주 묻는 질문
화면에서 색을 추출하려면 어떻게 하나요?
“화면에서 추출”을 선택한 뒤 화면 아무 곳이나 클릭하면 그 색을 가져와요. 이 스포이트는 컴퓨터의 Chrome, Edge 등 Chromium 기반 브라우저에서 쓸 수 있어요. 다른 브라우저에서는 색상 견본을 누르면 시스템 색상 선택기가 열리며, 여기에 자체 스포이트가 있는 경우가 많아요.
어떤 색상 형식을 써야 하나요?
HEX는 웹 디자인에서 가장 흔하고 어디서나 작동해요. RGB와 HSL은 CSS에서 값을 직접 조정할 때 편리해요. OKLCH는 색조가 달라도 밝기를 일정하게 유지하는 최신 CSS 형식이에요. CMYK는 인쇄를 위한 출발점이에요.
밝은 단계와 어두운 단계는 어떻게 다른가요?
밝은 단계(틴트)는 색에 흰색을 섞어 더 밝아진 색이에요. 어두운 단계(셰이드)는 검은색을 섞어 더 어두워진 색이에요. 각 단계가 고르게 보이도록 지각 기반 색 공간에서 섞어요.
키보드로도 쓸 수 있나요?
네. 색상 영역에 포커스를 두고 화살표 키로 채도와 명도를 바꾸세요. Shift를 누르고 있으면 더 크게 움직여요. 색조와 불투명도 슬라이더도 화살표 키로 조작할 수 있어요.
색상을 공유할 수 있나요?
네. 고른 색상에 맞춰 페이지 주소가 바뀌므로 북마크하거나 링크를 다른 사람에게 보낼 수 있어요.