João GabrielMedeiros Pereira
João Gabriel
← projetos

Sistema sem tela

devaocubo-ds

Design system com os tokens de cor, raio e tipografia dos meus painéis.

Pacote de tokens em Tailwind v4 compartilhado pelos painéis e por este site. Código aberto.

código

tipo
Sistema sem tela
estado
em desenvolvimento
plataformas
web
conferido em
2026-10-15

O que faz

  • Tokens de cor, raio e estado

    Valores em HSL para o tema claro, com cores de sucesso e aviso.

  • Tema escuro por sobrescrita

    Troca por atributo na página ou pela preferência do sistema.

  • Pronto para geradores

    Um defaults.json com os blocos claro e escuro, espaçamentos, fonte e cores de gráfico.

  • Contrato testado

    Testes exigem as chaves obrigatórias e valores não vazios nos dois temas.

Como funciona

  1. Tokens em CSS

    cor, raio, estados

  2. Tema Tailwind v4

    classes utilitárias

  3. defaults.json

    para geradores

  4. Pacote git

    sem registro npm

  5. Painéis web

Fluxo simplificado, ilustrativo.

Evolução

  1. 2026-08-09

    Primeiros tokens

    Cor e raio extraídos de um painel existente.

    entregue
  2. 2026-08-09

    Convenção de consumo

    Documentado como os painéis usam os tokens.

    entregue
  3. 2026-08-25

    defaults.json exportado

    Para o gerador de projetos.

    entregue
  4. 2026-09-04

    Tokens semânticos

    Sucesso, aviso e gráfico.

    entregue
  5. 2026-09-16

    Mais uma receita de componente

    Collapsible entra na lista.

    entregue

Como foi feito

CSS com Tailwind v4, JSON de tokens e testes com node --test; sem etapa de build.