CSS 변수 생성기
색상 토큰을 만들고 변수별 미리보기를 확인한 뒤, 바로 사용할 CSS 커스텀 속성을 복사하세요.
사용 방법
- brand, theme, ui 같은 변수 접두어를 입력하세요.
- 각 변수 이름과 색상을 수정하세요.
- 필요하면 행을 추가해 변수를 더 만드세요.
- 생성된 CSS를 복사해 스타일시트에 붙여넣으세요.
색상 미리보기
--brand-primary
--brand-secondary
--brand-accent
생성된 CSS 변수
:root {
--brand-primary: #4f46e5;
--brand-secondary: #06b6d4;
--brand-accent: #f59e0b;
}