zaklad

Web + nativoUma biblioteca, ReactJS e React Native

Figma ↔ código 1:1Mesmos nomes de props, dos dois lados

Herança em tudoTemas, tokens e tamanhos em cascata

Uma ferramenta só, não váriasTokens, Figma, componentes, docs, integrados

O PROBLEMA

Design systems são difíceis.Não deveriam ser.

Soterrados na execução

A maior parte do tempo de DS vai para execução: tokens, temas, scripts de sincronização. Estratégia fica com o que sobra.

Ferramentas fragmentadas

Uma ferramenta para tokens. Outra para componentes. Scripts customizados para Figma. Nada conversa com nada.

Reinventar a roda

Cada equipe constrói sua própria arquitetura e convenções. O mesmo esforço, recriado toda vez.

Abordagem tradicional

• Equipe especialista dedicada para construir e manter
• Mais uma pilha de ferramentas pagas para cobrir as lacunas
• Desenhar cada componente do zero
• Escolher e manter sua própria arquitetura
• Manter pipelines de build customizados
• Conectar Figma, código e docs você mesmo
• Manter tudo sincronizado manualmente
• Escrever e manter documentação

Meses até a v1.0Mais uma média de €200–400 mil/ano em salários de equipe

Com Zaklad

• Builders solo conseguem entregar; multiplicador de força para especialistas
• Uma assinatura substitui a pilha de ferramentas
• Wizard, importação ou construção do zero
• Arquitetura de melhores práticas embutida
• Pipeline de build completo incluído
• Sincronização com Figma via plugin Zaklad
• Temas, tokens e tamanhos em cascata
• Cada saída é entregue na mesma versão

Minutos até a v1.0Planos de solo a enterprise. Veja preços

COMO FUNCIONA

Três passos para um sistema completo.

01

Aponte para a sua marca

Comece com o wizard, importe seu sistema existente ou construa do zero. Cores e fontes entram pelos nomes reais e saem como uma arquitetura de tokens completa.

02

Ajuste

Refine tokens, temas e níveis de escala com pré-visualização ao vivo. Cada valor herdado atualiza automaticamente.

03

Entregue em todo lugar

Um clique envia bibliotecas Figma para designers, pacotes tipados para desenvolvedores e docs que se mantêm atualizados com ambos.

A partir daqui, ele acompanha você.

Sua marca evolui, sua equipe cresce, seu sistema permanece alinhado. Sem rebuilds. Sem handoffs. Sem drift.

POR QUE ZAKLAD

Tudo que seu design system precisa.Nada que ele não precise.

Da marca ao sistema, em minutos

O wizard pega sua marca e constrói uma arquitetura de tokens completa em minutos: paletas OKLCH, escalas tipográficas, espaçamentos, componentes e temas. Pule para importar um sistema existente ou construa do zero. Não é uma caixa-preta: refine cada token manualmente e entregue código de produção real e tipado.

Pequenas marcas1–3 cores, um sistema completo em minutos

Equipes médias5–8 cores de marca, mapeamento inteligente de papéis

Grandes equipessemanas de trabalho de arquitetura, comprimidas em minutos

brand.500 bg.primary button.bg

Uma mudança. Tudo atualiza.

Altere um valor de fundação e seus tokens semânticos, tokens de componente, temas, Figma Variables e pacotes de desenvolvimento acompanham. A arquitetura faz o trabalho, então mudanças continuam baratas por mais que o sistema cresça.

• Cascata em três camadas: Fundação → Semântico → Componente
• Temas herdam uns dos outros, mudanças descem em cascata
• Preenchimento automático em tokens semânticos, tamanhos de componente e níveis de escala
• Cálculos de token como spacing.md = dimension.base × 4

brand.500 alterado

bg.primary atualiza

button.bg atualiza

Themes herdam

Figma Variable sincroniza

Development acompanha

Tokens para produção. Uma plataforma.

Outras ferramentas entregam tokens e desejam boa sorte. Zaklad entrega a cadeia inteira: componentes multiplataforma para web e nativo, Figma Variables com Code Connect e pacotes tipados. Designers e desenvolvedores chegam à mesma fonte.

• Figma Variables, Text Styles, componentes de ícone e Code Connect
• Componentes multiplataforma, uma biblioteca para ReactJS e React Native
• Pacotes totalmente tipados com paridade de props 1:1 com Figma
• Endpoint MCP de leitura/escrita e um DESIGN.md de arquivo único para qualquer agente de IA

Tokens

Componentes

Figma

Código

Docs

Mude sem recomeçar

Já tem um design system? Cole seu JSON DTCG e Zaklad importa a estrutura inteira, nomes intactos, sem remapeamento token por token. Você atualiza seu sistema, não o reconstrói.

Sem lock-in. Exporte seu sistema inteiro a qualquer momento. Em planos pagos, você é dono da sua saída para sempre, uso comercial incluído, mesmo após cancelar.

DTCG JSON.zaklad

{
  "color": { "primary": { "$value": "#28c0c2" } },
  "spacing": { "md": { "$value": "1rem" } },
  "radius": { "sm": { "$value": "0.25rem" } }
}

Importado como

color.primary #28c0c2

spacing.md 1rem

radius.sm 0.25rem