
Stripe
Um livro de contabilidade escrito com tinta índigo sobre vidro fosco.
Stripe utiliza uma linguagem quase monocromática para instrumentos financeiros: um fundo branco suave e frio com títulos em azul escuro, praticamente nenhum elemento cromado decorativo e um único tom de índigo brilhante (#533afd) que poderia ser usado como contorno de botão, link ou ícone. A tipografia é excepcionalmente fina, com peso de 300 pontos — mesmo em 56px —, o que transmite uma sensação de discrição elegante em vez de um visual corporativo ostensivo; o espaçamento entre letras diminui drasticamente com o aumento do tamanho. Os botões são pequenos, quadrados (4px) e utilizam preenchimento roxo ou contornos roxos muito finos. O sistema evita completamente sombras; a profundidade é alcançada através da alteração das tonalidades de fundo (branco → #f8fafd → #e5edf5 → tons de roxo), em vez de relevo. Toda a interface se comporta como um livro-razão ou um terminal: informações densas, linhas claras, amplo espaço entre as seções e cores que aparecem apenas quando uma ação é necessária.
A largura máxima é de aproximadamente 1320px para uma coluna de conteúdo centralizada em uma tela branca. O elemento principal é um bloco de texto alinhado à esquerda, em tamanho total (56px), com duas chamadas para ação abaixo, sem imagem de destaque — a tipografia É o elemento principal. As seções são organizadas verticalmente com espaçamento igual de 96px e divisores de 1px (#e5edf5); não há alternância de faixas claras e escuras. Cada seção segue um padrão repetitivo: um pequeno título da seção em letras maiúsculas (cor esfumaçada, 12px), seguido por um cabeçalho de 32 a 48px, um parágrafo de 22px e, por fim, uma grade de cartões de produtos (3 colunas na versão desktop) ou um bloco de texto de 2 colunas com arte visual. Os logotipos dos clientes aparecem em uma faixa vertical estreita, alinhada à esquerda. O rodapé é uma faixa larga (#f8fafd) com listas de links em várias colunas. O ritmo geral é lento, cadenciado e predominantemente textual — a densidade de informações é baixa, apesar do longo comprimento da rolagem.
As imagens são discretas e em estilo documental. Fotos em página inteira aparecem apenas em seções com estudos de caso (por exemplo, fotografia aérea de tráfego para a Hertz), tiradas de cima ou em ângulos dramáticos, usando cores naturais — sem duotons ou processamento de cores. Capturas de tela da interface do usuário do produto são usadas em cartões de recursos, renderizadas com ângulos nítidos e bordas claras, sem molduras de dispositivos. Os logotipos dos parceiros são exibidos em suas próprias cores, sem qualquer tipo de contorno. Não há ilustrações, renderizações 3D ou elementos gráficos abstratos decorativos. Os ícones são uniformes: espessura de linha 1, espessura de linha 2 em fundo branco, com arte linear geométrica (chevrons, setas, marcas de seleção, símbolos de documentos). A página consiste principalmente de texto e espaço em branco; as imagens ocupam menos de 3% da área visual total.
Paleta
Marca
- Indigo Ink
#533afd— A cor roxa é usada para botões preenchidos, estados de navegação selecionados e momentos de conversão que exigem foco. - Indigo Hover
#7389ff— A cor roxa é usada para destacar links, tags e frases curtas. Não deve ser usada como cor principal para chamadas à ação.
Neutro
- Midnight Ink
#061b31— O título principal e o corpo do texto são de uma cor profunda, quase preta, com um tom azul frio, que serve de base para todo o sistema tipográfico. - Slate
#64748d— O texto em cinza destaca links, tags e frases curtas. - Steel
#50617a— Textos adicionais e materiais de apoio são posicionados entre os tons de ardósia e roxo suave usados nas sublicenças. - Smoke
#839bc8— Para títulos decorativos grandes e textos complementares, utiliza-se um tom de roxo suave – nunca em parágrafos do corpo do texto. - Pure White
#ffffff— A tela da página e as superfícies em relevo dos cartões; o plano de fundo padrão em relação ao qual tudo o mais é medido. - Mist
#f8fafd— O fundo do rodapé e o divisor de seção apresentam um tom frio sutil que separa as áreas sem uma borda visível.
Tipografia
de 12 a 56px · 9 etapas
- sohne-var — substituição: Inter Tight (variable · esboços 300, 400 · A única fonte usada em toda a interface é para títulos, texto corrido, navegação, botões e rótulos. A fonte de peso 300 prevalece mesmo em telas de 56px, o que é uma característica distintiva: os títulos são sutis em vez de chamativos, estabelecendo autoridade por meio da sobriedade em vez do volume. A fonte de peso 400 aparece apenas em tamanhos de 14 a 16px para navegação e texto de botões, onde um traço extra é necessário para legibilidade em tamanhos menores.
Intervalos e forma
| Propósito | Significado |
|---|---|
| Densidade | espaçoso |
| Passo básico | 8px |
| Raio do botão | 4px |
| Raio do cartão | 4px |
| Sombras | não - bordas em vez de sombras |
| Entre seções | 96px |
| Largura da página | 1320px |
A IA criará seu site no estilo Stripe e o preencherá.
- Compartilhe produtos e publicações através dos links - Instagram, TikTok, Facebook.
- Transfira o conteúdo do seu site antigo — basta especificar o endereço.
- Design moderno na melhor engine: React ( Next.js) com renderização no servidor e otimização de SEO integradas.
- Otimização de SEO totalmente automatizada para resultados de pesquisa e recomendações de redes neurais.
Estilos semelhantes
- Ui — Plano clínico em papel fosco
- monopo saigon — Um brilho líquido e iridescente por trás do silêncio editorial — uma galeria editorial monocromática flutuando em luz incandescente.
- Ventriloc — Um observatório editorial de dados em papel morno – uma única brasa alaranjada destacando a precisão monocromática.
- Hyer Aviation — Crepúsculo na cabine de pilotagem sobre pergaminho. O céu pálido da aurora encontra o logotipo serifado do tamanho da fuselagem, e um único detalhe em tom de barro quente quebra a sobriedade monocromática.
- Family — Uma ilustração de um conto de fadas em pergaminho creme.
- OFF+BRAND. — Esfera iridescente sobre pergaminho quente
- Geniestudio — Um caderno leve e delicado — daqueles com margens largas e um traço grosso de caneta.
- xAI — Laboratório de Creme Quente com Pílula Preta
- Seed — um organismo vivo sob vidro de laboratório
- Cosmos — Uma parede de galeria forrada com linho e decorada com fotos Polaroid.
- Cal — Praticidade monocromática, uma abordagem humana. Um sistema que prioriza a clareza e a funcionalidade através de uma paleta estritamente em preto e branco, mas que a suaviza com tipografia amigável e formas arredondadas.
- T1 Energy — Um desenho de uma unidade de produção em pergaminho morno é uma cena monocromática e tranquila, onde a escala industrial e a tipografia sutil incorporam toda a essência da marca.