색상 단계 생성기
기준 색상에서 밝고 어두운 색상 단계를 만듭니다.
이 도구에 대해
버튼, 배경, 테두리, 차트, UI 상태에 사용할 색상 단계를 하나의 기준 색상에서 생성합니다.
CSS 변수나 디자인 토큰으로 옮기기 쉽게 단순한 HEX 출력에 집중했습니다.
단계 50
#F4F7FE
단계 100
#E5ECFD
단계 200
#C2D3F9
단계 300
#96B4F5
단계 400
#628FF1
단계 500
#2563EB
단계 600
#2157CF
단계 700
#1B49AE
단계 800
#153988
단계 900
#102A63
단계 950
#0A1A3D
사용 방법
- 1
필요한 값을 입력하거나 텍스트를 붙여넣습니다.
- 2
옵션이나 단위를 원하는 방식으로 조정합니다.
- 3
표시된 결과를 확인하고 필요한 곳에 복사해 사용합니다.
기능
즉시 결과
값을 입력하면 결과가 브라우저에서 바로 업데이트됩니다.
브라우저 처리
입력값은 서버로 업로드하지 않고 기기 안에서 처리됩니다.
간단한 입력
반복 사용에 맞춘 명확한 입력 필드와 출력값을 제공합니다.
무료 사용
가입이나 설치 없이 바로 사용할 수 있습니다.
주요 사용 사례
- ›제품 UI에 사용할 작은 컬러 스케일을 만듭니다.
- ›배경, 테두리, hover, active 색상을 준비합니다.
- ›기준 색상이 전체 인터페이스 팔레트로 확장 가능한지 빠르게 확인합니다.