其他
workings
DSM
Index

DSM

Design Token

  • css 变量
  • figma 变量

落地场景

  • color、opacity、shadow
  • icons
  • font-size、-weight、-family、letter-spacing、line-height
  • border、-weight、-style
  • spacing、media-query(breakpoint)、transition、z-index

Token层级

  • Global Token

Figma官方推荐的三级Token

  • Primitive Token
  • Semantic Token
  • Component Token

如何实现Token

  • styles
  • variables