색상 음영 생성기 任意 색상의 더 어두운 음영을 조정 가능한 단계 수로 생성합니다.
색상 음영 생성기
任意 색상의 더 어두운 음영을 조정 가능한 단계 수로 생성합니다.
베이스 색상 선택
시작점으로 사용할 색상을 任意로 선택하세요.
단계 조정
생성할渐進的に 暗くなる 色の 수를 선택하세요.
색상 복사
개별 색상 또는 전체 세트를 복사하세요.
What Is 색상 음영 생성기?
색조 생성기는 색상 공간에서 기본 색상의 밝기를 체계적으로 줄여가며 점진적으로 더 어두운 버전을 만듭니다. 색조는 원래의 색调과 채도를 유지하면서 검은 색으로 이동하여 일관된 더 어두운 변형 세트를 생성합니다. 이는 브랜드 색상 - 기본 버튼용 원본에서 텍스트, 테두리 및 호버 상태에 대한 깊은 버전까지 여러 강度가 필요한 디자인 시스템에서 필수적입니다. RGB에서 단순히 검은색을 추가하는 것(주관적인 색调이 변경될 수 있음)과는 달리 HSL 기반 접근 방식은 전체 음영 범위 전반에 걸쳐 색상 정체성을 보존합니다. 조정 가능한 단계 수를 통해 간단한 3단계 세트에서부터 포괄적인 15단계 규모까지 모든 것을 생성할 수 있습니다.
Why Use 색상 음영 생성기?
-
HSL 기반의 어둡게 하는 기능은 모든 색상에서 일관된 색조를 유지합니다
-
調整可能한 단계 수 (3 ~ 15)로 다양한 용도에 맞춤
-
각 色상에는 밝기 백분율이 표시되어 참조용으로 사용할 수 있습니다
-
디자인 시스템의 색상 스케일을 구축하기 위한 완벽한 도구
-
개별 색상 또는 전체 세트를 한 번에 복사할 수 있는 기능
Common Use Cases
디자인 토큰
디자인 시스템용으로 숫자가 매겨진 色상 스케일 (600, 700, 800, 900)을 생성하세요.
호버 상태
베이스 색상과 일관된 버튼 호버 상태의 暗くなる 색상을 생성하세요.
텍스트 색상
제목 및 본문 텍스트용으로 브랜드 색상의 어둡게 하는 色상을 찾으세요.
테두리 및 그림자
테두리, 아웃라인, 그림자 색상 등의 暗くなる 변형을 얻으세요.
Technical Guide
음영 생성기는 기본 색상을 HSL로 변환하고 밝기를 기본 값에서 거의 0으로 줄여가며 N개의 음영을 만듭니다. 각 음영의 공식은 L = baseLightness × (1 - i/(N-1))이며, 여기서 i는 0부터 N-1까지입니다. 이는 원래 색상에서 거의 검은색에 이르는 균일한 분포를 생성합니다. 색조와 채도는 일정하게 유지되어 모든 음영이 서로 다른 어두운 수준에서 주관적인 동일한 색상을 보장합니다. 색론에서는 음영이 특히 흰색과 혼합된 틴트(tint)나 회색과 혼합된 톤(tones)과 대조적으로 검은색과 혼합된 색상임을 명시합니다. HSL 접근 방식은 RGB 어둡게 하는 것보다 더 주관적인 통일성을 제공하며, 이는 세 채널 모두를 비례하여 조정해야 합니다.
Tips & Best Practices
-
1표준 디자인 시스템 스케일 (100-900)을 생성하기 위해 9단계를 사용하세요
-
2가장 어둡게 하는 色상은 밝은 배경의 텍스트에 적합합니다
-
3색상 및 틴트 생성기를 조합하여 완전한 색상 스케일을 만들 수 있습니다
-
4따뜻한 색상 (빨강, 오렌지)의 暗くなる 색상은 우수한 어둡게 하는 배경으로 사용할 수 있습니다
-
5의도된 배경과 충분한 대조를 위해 暗くなる 色상을 테스트하세요
Related Tools
Frequently Asked Questions
Q 색상의 暗くなる 색상과 밝아지는 색상은 무엇인가?
Q RGB에서 어둡게 하는 이유는 무엇인가?
Q 몇 단계를 사용해야 하나?
About This Tool
색상 음영 생성기 is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.