Tamanho da Borda (Border Width):
Variante: thin, regular, thick Escala: 1, 2, 3 (representando diferentes espessuras) Nome completo: {Namespace}-border-width-{Variant}-{Scale} Arredondamento da Borda (Border Radius):
Variante: small, medium, large Escala: 1, 2, 3 (representando diferentes níveis de arredondamento) Nome completo: {Namespace}-border-radius-{Variant}-{Scale} Por exemplo, se estivermos trabalhando no design system "MyDesign", os tokens poderiam se parecer com isso:
Tamanho da Borda:
mydesign-border-width-thin-1: 1 pixel de espessura para bordas finas. mydesign-border-width-regular-2: 2 pixels de espessura para bordas regulares. mydesign-border-width-thick-3: 3 pixels de espessura para bordas grossas. Arredondamento da Borda:
mydesign-border-radius-small-1: Pequeno arredondamento de borda, escala 1. mydesign-border-radius-medium-2: Arredondamento médio de borda, escala 2. mydesign-border-radius-large-3: Grande arredondamento de borda, escala 3.