import { violet, ink } from "./primitives"; export const semantic = { surface: { base: ink[900], raised: ink[850] }, border: { subtle: ink[700], strong: ink[600] }, // o primitivo nunca vaza para o componente: accent: { default: violet[500], bright: violet[400] }, text: { primary: ink[100], secondary: ink[300] },} as const; export type SemanticToken = keyof typeof semantic;PLACEHOLDER — Tokens antes de componentes
PLACEHOLDER — Por que a primeira coisa a existir em um design system não é um botão, e sim o vocabulário que descreve o botão.
Ler o post