🏷️ 색상 이름 찾기
고른 색과 가장 가까운 CSS 표준 색 이름을 유사도 순으로 알려 드립니다.
사용 방법
- 궁금한 색을 색상 선택기로 고릅니다.
- 한글 색 계열과 가장 가까운 CSS 색 이름 5개가 유사도와 함께 표시됩니다.
- 코드에서 쓰려면 색 이름이나 HEX 버튼을 눌러 복사합니다.
이럴 때 유용해요
- 디자인 문서에 '이 색'을 말로 설명해야 할 때
- CSS에서 HEX 대신 기억하기 쉬운 색 이름을 쓰고 싶을 때
- 고객이 보낸 색이 대략 어떤 계열인지 빠르게 파악할 때
알아두면 좋은 팁
- 색 차이는 단순 RGB 거리보다 사람 눈에 가깝게 보정한 redmean 가중 공식으로 계산합니다.
- 유사도 100%는 완전히 같은 색이라는 뜻입니다. 95% 이상이면 육안으로 거의 구분되지 않습니다.
- CSS 색 이름 전체 목록을 훑어보려면 'CSS 색상 이름표' 도구를 함께 사용하세요.
자주 묻는 질문
CSS 색 이름은 몇 개나 있나요?
CSS Color Module에 정의된 표준 색 이름은 gray/grey 같은 철자 변형을 제외하면 약 140개입니다. red, blue 같은 기본색부터 rebeccapurple, papayawhip 같은 독특한 이름까지 모든 브라우저가 동일하게 해석합니다.
가장 가까운 색은 어떻게 판정하나요?
두 색의 RGB 차이를 redmean 가중치(빨강 평균값에 따라 R·G·B 채널 가중치를 달리하는 방식)로 계산해 사람 눈의 민감도에 가깝게 순위를 매깁니다. 단순 거리 계산보다 초록 계열 구분이 정확합니다.
한글 색 계열은 어떤 기준인가요?
HSL 색공간에서 색상(Hue) 각도를 빨강·주황·노랑·초록·청록·파랑·보라·분홍 8계열로 나누고, 채도가 낮으면 흰색·회색·검정으로 분류합니다. 밝기·채도에 따라 '연한', '어두운', '선명한' 수식어가 붙습니다.
실무에서 HEX 대신 색 이름을 써도 되나요?
브라우저 지원에는 전혀 문제가 없습니다. 다만 디자인 시스템에서는 정확한 값 관리가 어려워 HEX나 변수 사용이 일반적이고, 색 이름은 프로토타입·데모 코드에서 빠르게 쓸 때 편리합니다.
