Template de site
SvelteKit SaaS Kit
Um template gratuito de SaaS construído com SvelteKit, Supabase e shadcn-svelte, incluindo cadastro, OAuth, verificação de e-mail e gerenciamento de conta. Código aberto.
SaaS · Kit inicial · Grátis
Páginas
Capturas da demonstração, página por página. Role dentro de cada página para vê-la inteira.
Análise do design
Uma leitura feita por IA do design deste template: cores, tipografia, espaçamento, seções e detalhes marcantes. O Ottermind parte dela quando você usa o template.
- Visão geral
Página inicial de SaaS, clima limpo e moderno, densidade média, claro
- Paleta
fundo #ffffff; superfícies [#f8fafc, #2563eb, #0f172a, #e2e8f0]; texto #0f172a; texto suavizado #334155; primário #2563eb; acentos []
- Tipografia
títulos Lexend, 500, caixa de frase; corpo Inter, 18px; escala h1 72px / h2 48px / h3 16px
- Forma e espaçamento
raio do botão 9999px, raio do cartão 12px, sem bordas, sombra rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset, espaçamento entre seções 80px, largura do conteúdo 1216px
- Seções (de cima para baixo)
- Cabeçalho — navegação horizontal com logotipo, links, entrada e botão CTA, fundo branco
- Hero — título centralizado com "made simple" sublinhado em azul, subtítulo, dois botões CTA, fundo branco
- Selos de confiança — linha de seis logotipos de empresas, centralizada, fundo branco
- Seção de recursos — fundo gradiente azul, título, subtítulo, lista de recursos alinhada à esquerda com ícones, mockup da interface de software alinhado à direita
- Simplificação de tarefas — layout em três colunas com ícones, rótulos e descrições, fundo branco
- Depoimentos — grade de seis cartões com citações, nomes, cargos e avatares circulares, fundo branco
- Preços — fundo escuro, cartões de preços em três níveis com nível intermediário destacado, cada um com recursos e botões "Get started"
- Perguntas frequentes — layout em três colunas com perguntas e respostas, fundo gradiente claro
- Rodapé — logotipo centralizado, links de navegação, direitos autorais, ícones sociais, fundo branco
- Detalhes marcantes
- Palavras sublinhadas nos títulos ("made simple", "Simple pricing")
- Fundos gradientes que transitam do azul para o roxo
- Mockups da interface de software embutidos nas seções
- Cantos arredondados em cartões e botões
- Sombras sutis internas em elementos interativos
- Uso consistente da cor azul primária em CTAs e destaques
- Outras páginas
- /pricing: Níveis de preços com recursos e CTAs
- /testimonials: Citações de usuários com avatares e funções
Detalhes do template
- Categoria
- SaaS, Kit inicial
- Autor
- kizivat
- Publicado em
- 21st.dev
- Preço
- Grátis
- Boilerplate
- SaaS
Design original de kizivat, publicado no 21st.dev. O Ottermind não copia o código do template: ele cria um site novo a partir do briefing.
O briefing de onde o Ottermind parte
Ele abre no Studio como rascunho — acrescente sua marca, público e páginas antes de enviar.
Crie um site de SaaS inspirado no template "SvelteKit SaaS Kit". Resumo de referência: Um template gratuito de SaaS construído com SvelteKit, Supabase e shadcn-svelte, incluindo cadastro, OAuth, verificação de e-mail e gerenciamento de conta. Código aberto. Estilo e recursos a refletir: Boilerplate. Use copy e imagens originais para minha marca em vez do conteúdo placeholder do referência.
Como usar este template
- 1
Clique em “Usar este template” para abri-lo no Ottermind Studio com o briefing preenchido.
- 2
Acrescente ao briefing sua marca, público, páginas e conteúdo.
- 3
O Ottermind cria um site novo inspirado neste design — continue ajustando pelo chat.
