밝기 단계 팔레트
한 색의 밝고 어두운 단계
기준 색
밝기 단계 팔레트 소개
색 하나를 넣으면 그 색을 기준으로 아주 밝은 색부터 아주 어두운 색까지 10단계를 만들어 주는 도구입니다. 브랜드 색 하나로 버튼의 눌린 색, 연한 배경, 테두리, 진한 글자색을 일관되게 뽑아낼 때 씁니다. 결과는 CSS 변수 묶음으로 한 번에 복사할 수 있습니다.
사용법
- 기준 색을 고릅니다.
- 50(가장 밝음)부터 900(가장 어두움)까지 10단계가 나옵니다.
- 색을 눌러 하나씩 복사하거나 CSS 변수 전체를 복사합니다.
자주 묻는 질문
- 기준 색은 몇 번 단계에 들어가나요?
- 기준 색의 밝기와 가장 가까운 단계에 그대로 들어가고, 나머지 단계는 그 색의 색상과 채도를 지키면서 밝기를 바꿔 만듭니다.
- 단계는 어떻게 쓰면 좋나요?
- 50~100은 연한 배경, 200~300은 테두리, 500~600은 버튼 같은 주된 색, 700~900은 글자색에 흔히 씁니다.