Color Theory

명도

색이 반사하는 빛의 지각량으로, 검정(0%)에서 흰색(100%)까지의 범위를 가짐.

Lightness is a perceptual measurement that indicates how light or dark a color appears. In the HSL model, lightness is the third component measured as a percentage, where 0% is pure black, 50% is the pure hue, and 100% is pure white. Lightness differs from brightness (used in HSV/HSB) in that maximum lightness always produces white regardless of saturation. In the CIELAB color space, the L* axis represents perceptual lightness, designed to be more uniform with human perception than HSL lightness.

직접 해보기

색상 변환기

HEX, RGB, HSL, HSV, CMYK, OKLCH 색상 형식 간에 즉시 변환합니다.

쉐이드 생성기

디자인 시스템을 위해 모든 기본 색상에서 Tailwind CSS 스타일의 쉐이드 스케일(50~950)을 생성합니다.

관련 글

CSS color-mix(): 브라우저에서 기본적으로 색상 혼합

브라우저에서 기본적으로 색상을 혼합하는 CSS color-mix()를 알아보세요. 구문, 색상 공간, 실제 사용 사례를 마스터하고 JavaScript 없이 동적 팔레트를 만드세요.

처음부터 색상 선택기 웹 구성 요소 구축

웹 구성 요소로 액세스 가능한 색상 선택기를 구축합니다. Shadow DOM을 사용하여 캔버스 렌더링, 색조 슬라이더, 알파 채널 및 사용자 정의 이벤트를 구현합니다.

색상 교정(Color Proofing): 정확한 인쇄 색상 보장

소프트 교정, 하드 교정, 인쇄기 교정 기법을 배워 화면에서 최종 출력까지 정확한 인쇄 색상 재현을 보장하세요.

에메랄드 vs 제이드 vs 포레스트 그린: 녹색 비교 가이드

에메랄드(#50C878), 옥(#00A86B), 포레스트 그린(#228B22)을 비교해보세요. 인기 있는 녹색 색상 간의 시각적 및 16진수 코드 차이점을 알아보세요.

CSS light-dark() 기능: 기본 테마 전환

기본 테마 전환에는 CSS light-dark()를 사용하세요. 밝은 모드와 어두운 모드 색상을 위해 JavaScript 토글과 미디어 쿼리를 단일 CSS 함수로 대체합니다.

청록색과 청록색의 차이점

청록색(#00FFFF)과 청록색(#40E0D0)은 비슷해 보이지만 색상 모델 위치, 채도 및 사용 사례가 근본적으로 다릅니다. 전체 분석은 다음과 같습니다.