AI 분석
전역 색 토큰과 별칭 토큰을 수정하면 버튼·배너·인디케이터 스티커 시트가 함께 바뀌는 과정을 보여주는 영상이다.
화면 왼쪽에는 브라우저의 스티커 시트, 오른쪽에는 CSS 토큰 파일을 띄운 스플릿 구성이다. 스티커 시트는 흰 배경에 세리프 제목과 산세리프 섹션 라벨을 쓰고, 파랑·빨강·노랑·초록 네 가지 의미 색을 채움·외곽선·텍스트 버튼, 제목과 메시지가 있는 배너, 원형 로딩 인디케이터에 일관되게 적용한다. 코드 쪽은 0~100 단계의 전역 색 스케일과 background·text·border 별칭 토큰을 나누어 정의하며, 별칭 값을 blue-60에서 blue-40으로 바꾸자 accent 색 버튼과 배너가 즉시 짙은 파랑으로 바뀐다. 전역 토큰과 시맨틱 별칭 토큰의 2계층 구조와 컴포넌트 상태 정리 방식을 설명하는 디자인 시스템 레퍼런스로 유용하다.
minimal · light-mode · techy
claude-opus-5-5 · 2026-10-21 16:32 · 신뢰도 0.75
