색상 이름 찾기(HEX 코드)

가장 가까운 이름은 색상 거리로 고릅니다.

도구는 입력 색과 이름 목록의 RGB 채널 차이를 비교합니다. 완전히 같은 값이 없을 때도 가장 작은 거리를 가진 후보를 결과로 제시합니다.

• 빨강·초록·파랑 차이를 함께 계산합니다.
• 가까움은 시각적 인상과 완전히 같다는 뜻이 아닙니다.
• 후보 칩에서 이웃한 값을 나란히 확인할 수 있습니다.

HEX는 여섯 자리로 빛의 양을 적습니다.

HEX의 두 자리씩은 빨강, 초록, 파랑 채널을 00부터 FF까지 기록합니다. #3498DB라면 34, 98, DB가 각각 한 채널의 밝기입니다.

• #을 포함해 적으면 CSS에 바로 붙일 수 있습니다.
• 00은 해당 채널이 가장 어둡다는 뜻입니다.
• FF는 해당 채널이 가장 밝다는 뜻입니다.

RGB와 HSL은 같은 색을 다른 관점에서 설명합니다.

RGB는 화면이 섞는 세 빛의 수치이고 HSL은 색상환에서의 위치와 선명도, 밝기를 읽기 편하게 정리한 값입니다.

• RGB는 픽셀 값과 비교할 때 편리합니다.
• HSL은 톤을 조절할 때 방향을 잡기 쉽습니다.
• 두 표기는 같은 결과 색을 가리킬 수 있습니다.

색상·채도·명도는 조정의 방향을 보여줍니다.

HSL의 hue는 색상환 각도이며 lightness는 검정과 흰색 사이의 위치입니다. 채도가 낮아지면 같은 hue도 회색에 가까워집니다.

• hue 0도 부근은 붉은 계열입니다.
• lightness 50%는 극단 사이의 중간 지점입니다.
• 채도만 낮추면 색의 기운은 남고 선명도는 줄어듭니다.

CSS/W3C 이름은 영어로 남겨 둡니다.

표준 이름은 명세와 코드에서 English 식별자로 정의되어 있어 번역하지 않습니다. 개발 문서와 브라우저가 같은 철자를 읽도록 하는 선택입니다.

• 이름 자체는 CSS에서 사용할 수 있습니다.
• 브랜드 별칭과 표준 이름은 구분해 기록합니다.
• 결과 이름은 색의 정확한 품질 등급이 아닙니다.

비슷한 색상 칩으로 선택지를 좁힙니다.

첫 결과만 보고 확정하기보다 후보 칩의 HEX와 스와치를 비교해 보세요. 배경이나 화면 밝기에 따라 더 자연스러운 선택이 달라질 수 있습니다.

• 칩을 누르면 그 값을 새 입력으로 엽니다.
• 인접 후보의 명도 차이를 확인합니다.
• 결정한 값은 복사해 작업 문서에 남깁니다.

최근 색상은 브라우저 안에서만 이어집니다.

확인한 색은 이 기기의 브라우저 저장소에 남아 다시 불러올 수 있습니다. 공용 컴퓨터에서는 지우기 버튼으로 기록을 제거하는 편이 좋습니다.

접근성 대비는 이름이 아니라 조합으로 검사합니다.

Blue나 Gray라는 이름만으로 글자가 읽힌다고 판단할 수 없습니다. 실제 글자색과 배경색의 대비 비율을 별도 검사기에 넣어 확인하세요.

입력 형식을 먼저 점검하면 실수를 줄입니다.

세 자리 HEX는 각 자리를 두 번 반복한 축약형이고, # 기호가 빠지면 CSS 값으로 오해하기 쉽습니다. 붙여넣기 뒤에는 여섯 자리 결과를 다시 읽으세요.

실무에서는 이름과 값을 함께 전달합니다.

예를 들어 브랜드 블루 #3498DB의 후보 이름을 확인한 뒤, “버튼 배경 #3498DB”처럼 적으면 디자이너와 개발자가 같은 값을 재현할 수 있습니다.