기준 색을 넣으면 색상환에서 각도를 돌려 만든 배색 여섯 벌을 보여줘요. 색을 누르면 HEX 가 복사되고, 세트째로 CSS 변수로도 복사할 수 있어요.
배색은 HSL 의 색상각만 돌리고 채도·명도는 기준 색을 그대로 따라가요. 그래서 파스텔 색을 넣으면 파스텔 배색이, 진한 색을 넣으면 진한 배색이 나와요.
각 색 위의 숫자는 그 배경과 글자색의 WCAG 대비비예요. 본문 글자는 4.5:1 이상, 큰 제목은 3:1 이상이면 접근성 기준을 만족해요.
색상환에서 180° 반대편 색이에요. 대비가 가장 세서 강조에 좋지만 넓은 면에 같이 쓰면 눈이 피로해요 — 주색 대비 10~20% 면적으로 쓰는 게 무난해요.
넓은 배경·카드에는 유사색이나 단색조가 안전하고, 버튼·배지처럼 눈에 띄어야 하는 요소엔 보색이나 분할 보색이 맞아요.
`--triadic-1: #3366CC;` 처럼 세트 이름과 순번이 붙은 커스텀 프로퍼티 목록이에요. 그대로 `:root` 안에 붙여넣으면 돼요.
아니요. 변환과 배색 계산이 모두 브라우저 안에서 끝나요.