명도·채도 팔레트, 왜 필요할까
디자인에서 하나의 브랜드 색상만으로는 배경·강조·비활성 상태 등 다양한 UI 요소를 표현하기 어렵습니다. 이 도구는 기준 색상의 색조(Hue)는 그대로 유지하면서 명도와 채도만 단계적으로 조절해, 색상 계열이 일관된 팔레트를 자동으로 만들어줍니다.
계산 원리
입력한 HEX 색상을 HSL(색조·채도·명도) 모델로 변환한 뒤, 명도 값만 20%부터 80%까지 5단계로 바꿔 하나의 열을 만들고, 채도 값만 20%부터 100%까지 5단계로 바꿔 또 다른 열을 만듭니다. 색조(Hue)는 두 열 모두에서 고정되어 있어 색상 계열의 통일감이 유지됩니다.
활용 팁
명도 단계는 다크모드·라이트모드 배경, 호버·비활성 상태 등 밝기 차이로 위계를 표현할 때 유용하고, 채도 단계는 같은 색조를 유지하면서 화려함의 정도를 조절할 때 좋습니다. 생성된 HEX 코드를 클릭하면 바로 복사할 수 있습니다.
자주 묻는 질문
Q. 명도와 채도의 차이는 무엇인가요?
A. 명도는 색의 밝고 어두운 정도, 채도는 색의 선명하고 흐린 정도를 나타냅니다. 같은 색상(Hue)이라도 명도·채도를 조절하면 전혀 다른 느낌의 팔레트를 만들 수 있습니다.
Q. 생성된 팔레트를 어디에 활용하나요?
A. 명도 단계는 하나의 색상으로 그림자·강조·배경 등 계층 구조를 표현할 때, 채도 단계는 같은 색조를 유지하며 톤을 조절할 때 유용합니다.
Q. 색상(Hue) 자체를 바꾸려면 어떻게 하나요?
A. 이 도구는 선택한 기준 색상의 색조(Hue)를 그대로 유지한 채 명도·채도만 변형합니다. 다른 색조를 원하면 기준 색상을 먼저 변경하세요.