Stylepack

Fontes

As fontes que o supabase.com usa

O supabase.com usa Manrope nos títulos e Inter no texto corrido. Manrope é uma fonte licenciada que o próprio site serve. A alternativa gratuita mais próxima no Google Fonts: Manrope, Inter.

Medido no supabase.com há 4 dias.

Abrir o pacote de design completoBaixar o pacote

Famílias de fontes

2 famílias
Manrope
Usada em
h1, h2, h3
Origem
Auto-hospedada
Alternativa gratuita
Manrope
Inter
Usada em
body, label, button
Origem
Auto-hospedada
Alternativa gratuita
Inter

CSS para reproduzir

Variáveis de fonte com a substituta gratuita na pilha, para que o mesmo CSS funcione com ou sem a fonte licenciada.

:root {
  --font-heading: "Manrope", "Manrope", sans-serif; /* Manrope stands in for Manrope */
  --font-body: "Inter", "Inter", sans-serif; /* Inter stands in for Inter */
  --font-size-base: 15px;
}

Como o texto é composto

headline-displayQuick brown foxManrope / 46px / 500 / lh 46px
headline-lgQuick brown foxManrope / 16px / 600 / lh 24px
headline-mdQuick brown foxManrope / 34px / 600 / lh 37.7778px
body-mdThe quick brown fox jumps over the lazy dogInter / 15px / 450 / lh 22.5px
label-mdThe quick brown fox jumps over the lazy dogInter / 12px / 500 / lh 1.33
buttonThe quick brown fox jumps over the lazy dogInter / 14px / 450 / lh 20px
Tamanhos de fonte em uso
12131415163446

Para agentes de IA

O pacote é texto puro, sem chave: busque o DESIGN.md ou entregue o pacote inteiro ao Claude Code, Cursor ou Copilot pelo servidor MCP.

curl -s https://stylepack.ai/packs/supabase.com/DESIGN.md

Perguntas

Qual fonte o supabase.com usa?

O supabase.com usa Manrope, Inter. Os títulos são compostos em Manrope e o texto corrido em Inter, medidos no site como ele é renderizado, não lidos da folha de estilos.

A fonte do supabase.com é gratuita?

Não. Manrope é uma fonte licenciada que o próprio supabase.com serve. A alternativa gratuita mais próxima é Manrope, Inter, disponível no Google Fonts. O CSS desta página a coloca na pilha de fontes como substituta.

Como ter a mesma tipografia do supabase.com no meu projeto?

Baixe o pacote de design do supabase.com no Stylepack: ele traz a pilha de fontes, a escala tipográfica, todos os estilos de texto e as capturas de tela, em um formato que um agente de código com IA, como Claude Code ou Cursor, consegue usar para construir.