Identidade
Tokens
Componentes, blocos e tokens prontos na identidade do Studio. Clone, ajuste para o cliente, publique.
30+
Componentes
10
Blocos
2
Temas
1
Fonte — Manrope
O que inclui
Tokens semânticos
CSS variables para cor, tipografia, sombra e radius. Dark por padrão, light em uma classe.
Componentes categorizados
Button, Input, Card, Alert, Tabs, Dialog e mais — organizados como daisyUI.
Blocos prontos
Hero, Pricing, FAQ, CTA, Testimonial, Lead Form — instale via registry com um comando.
Fluxo
Clone o template
Use o astro-base como ponto de partida. Já vem com Tailwind, tokens e a estrutura de pastas certa.
npx degit CarlosHPS/studio-kit/templates/astro-base Ajuste os tokens
Edite `tokens.css` com as cores e tipografia do cliente. Todos os componentes herdam automaticamente.
# tokens.css → --primary: 0 173 207 Publique
Faça deploy em Vercel, Netlify ou qualquer host estático. Build limpo, zero dependências pesadas.
pnpm build && pnpm preview FAQ
Sim. O Studio Kit é o sistema base — você ajusta os tokens de marca por cliente e os componentes herdam automaticamente. Cada projeto fica com a cara do cliente, não do Studio.
Execute `npx shadcn add @studio/<nome>` no projeto do cliente. O arquivo é copiado para a sua base de código — você é o dono do código, sem lock-in.
O template padrão é Astro, mas os componentes shadcn/ui funcionam em qualquer projeto React/Next.js. Os tokens CSS funcionam em qualquer framework.
Re-execute o comando de instalação para sobrescrever com a versão mais recente do registry. Como você tem o código, pode aceitar ou rejeitar mudanças manualmente.
Clone o template, ajuste os tokens do cliente e publique em minutos.