디자인 토큰은 디자인 의사결정을 데이터로 표현하여 인간과 기계 모두가 이해할 수 있는 형태로 인코딩한 것이다. 이는 디자인 시스템에서 재사용 가능한 값들을 정의하고 관리하는 기본 단위로 작용한다.
디자인 토큰은 일반적으로 계층 구조로 조직화되어 있다. 가장 기본적인 구조는 실제 값을 정의하는 Primitive Token(예: color-blue-500: #0066FF)과 이러한 기본값에 의미를 부여하는 Semantic Token(예: color-primary: {color-blue-500})으로 구성된다. 이러한 구조는 디자인 시스템의 일관성을 유지하면서도 테마 변경이나 디자인 업데이트에 유연하게 대응할 수 있게 해준다.
디자인 토큰은 색상, 타이포그래피, 간격, 애니메이션 등 다양한 디자인 요소를 포함하며, 이를 통해 디자인 결정사항을 코드로 자동화하고 여러 플랫폼에서 일관된 사용자 경험을 제공할 수 있다.