Decidido em 24/10/2026
Fonte dos títulos: Urbanist
Toque em "Usar nesta página" para aplicar a candidata em toda a página-guia e julgar com os componentes reais. Corpo e botões ficam em Inter (como a referência: títulos geométricos, botões Inter).
Tênis Firenze Bege | 5cm de Altura
Ninguém vai perceber você mais alto.
Aumento de altura discreto, couro legítimo e conforto para o dia todo. Troca grátis em 30 dias.
Geométrica moderna; pesos 400–700; a mais próxima da referência com 600 de verdade
Tênis Firenze Bege | 5cm de Altura
Ninguém vai perceber você mais alto.
Aumento de altura discreto, couro legítimo e conforto para o dia todo. Troca grátis em 30 dias.
Inspirada na Futura; elegante e de letras redondas; pesos 400–700
Tênis Firenze Bege | 5cm de Altura
Ninguém vai perceber você mais alto.
Aumento de altura discreto, couro legítimo e conforto para o dia todo. Troca grátis em 30 dias.
ESCOLHIDA (24/10). Geométrica leve e limpa; pesos 500–700 carregados no tema
Tênis Firenze Bege | 5cm de Altura
Ninguém vai perceber você mais alto.
Aumento de altura discreto, couro legítimo e conforto para o dia todo. Troca grátis em 30 dias.
Geométrica popular; mais larga e "amigável"; pesos 400–700
Tênis Firenze Bege | 5cm de Altura
Ninguém vai perceber você mais alto.
Aumento de altura discreto, couro legítimo e conforto para o dia todo. Troca grátis em 30 dias.
A da Conzuri. Só tem peso 400 — o 600 seria sintetizado pelo navegador
Tênis Firenze Bege | 5cm de Altura
Ninguém vai perceber você mais alto.
Aumento de altura discreto, couro legítimo e conforto para o dia todo. Troca grátis em 30 dias.
Neutra (não geométrica). Opção de uma fonte só para tudo
O tema carrega Urbanist (500/600/700) e Inter (400–700) do Google Fonts. As outras famílias ficam aqui só como histórico da comparação.
Cores
Tipografia
--texto-displayDisplay 28 → 48
--texto-h1H1 · Nome do produto 28 → 44
--texto-h2H2 · Título de seção 28 → 32
--texto-h3H3 · Subtítulo 19 → 24
--texto-h4H4 · Nome em card 14,5 → 18
--texto-corpoCorpo 16/24 — A altura faz parte da construção do tênis. Você calça e já está 5 cm mais alto.
--texto-corpo-2Corpo 2 14,5/22 — descrição, acordeão, depoimento.
--texto-legendaLegenda 12/16 — pílulas, selos, cidade, nota.
--texto-microSobretítulo 10 · caixa alta · tracking 0.12em
Peso dos títulos: 600 (decisão 24/10). Botões: 16/500, sem caixa alta.
Espaçamento (base 4 px)
4
8
12
16
24
32
48
64
Entre elementos 8–16 · entre blocos 24 · entre seções 48 (celular) / 64 (desktop).
Raios
--raio-1 · 8
--raio-2 · 12
--raio-3 · 16
--raio-pilula
Layout
Calha 16 px no celular, 20 px a partir de 768. Container máx. 1240 px. Grid 4 colunas (celular) / 12 (desktop). Use "Mostrar calha" no topo para ver a linha vermelha que nada deve ultrapassar — exceto sangrias.
Sangria com 1º item na calha
Botões
Raio pílula · texto 16/500 · sem caixa alta · hover escurece · active 0,99.
Pílulas e selos
Cards
Tênis Firenze Bege
Benefício
Troca grátis em 30 dias
Não serviu? Trocamos sem custo.
Esse foi o melhor tênis que comprei, o primeiro tênis de altura bonito e confortável.
Bloco de preço
Preço atual 18 → 28 (500), sempre preto; "de" 14 cinza riscado; o desconto vai no selo verde (decisão 24/10).
Seletor de tamanho
Campos
Acordeão
Descrição do produto
solado com elevação interna de 5 cm
palmilha confortável.
Trocas e devoluções
sem custo.
Carrossel com bolinhas
Depoimento curto de exemplo para medir o card.
Depoimento curto de exemplo para medir o card.
Depoimento curto de exemplo para medir o card.
Depoimento curto de exemplo para medir o card.
Depoimento curto de exemplo para medir o card.
Galeria de produto
Componente oficial: toda página de produto nasce com ele. Esteira que acompanha o dedo, encaixa foto a foto, com contador, setas (desktop), bolinhas e miniaturas sincronizadas. Arquivo snippets/ds-galeria.liquid, comportamento em assets/ds.js.
Parâmetros: product, uid, selo (imagem opcional no canto), selo_alt, estoque (etiqueta na 1ª foto), largura.
Bloco de compra
Ordem oficial (aprovada 25/10): avaliação → título → subtítulo → pílulas → preço → tamanhos → botão → garantia → entrega. O invólucro .ds-compra dá o respiro de 16 px entre as partes; .ds-compra__cta cola a garantia ao botão (4 px).
Chegará entre e
Comprando dentro das próximas 00:00:00
Garantia: ds-garantia (texto opcional). Entrega: ds-frete (dias_min, dias_max, horas, selo, rotulo); datas pulam domingo e o contador persiste no aparelho.
Barra fixa de compra (.ds-barra-compra): cola no rodapé da tela quando o botão principal sai de vista; --visivel mostra, senão fica escondida embaixo. Miniatura 48, nome em negrito, preço, botão M. Abaixo, parada, só para exemplo.
Faixa rolante de mensagens
Fundo preto, texto branco 14,5/500, ícone antes de cada frase, rolagem lenta (60 s), pausa ao passar o mouse. Separa dois blocos claros com uma pausa visual. Variante clara disponível.
Arquivo snippets/ds-faixa-rolante.liquid; parâmetro itens = "Texto::icone|Texto::icone"; clara: true para o fundo cinza.
Selo Reclame Aqui
Prova externa de idoneidade: logo + cinco estrelas em card do sistema. Não é link. Só usar com nota boa real na plataforma.
Nota ótima
Arquivo snippets/ds-selo-reclame-aqui.liquid; parâmetro opcional texto.
Modal
Fundo escuro (.ds-overlay) + caixa branca (.ds-modal, 400 px; --largo = 600 px) com botão fechar no canto (.ds-modal__fechar). Fecha no X ou clicando fora.
Tabela e passos
Tabela em caixa com borda e cantos de 8 px; cabeçalho em cinza claro (legenda 12/600), células corpo-2. --centro centraliza, --compacta aperta (versão deitada no desktop), __forte = negrito, __unidade = "cm" apagado. .ds-so-celular / .ds-so-desktop trocam a versão por tela. Usada na tabela de medidas.
- 01.Pise descalço sobre a folha.
- 02.Meça a distância com uma régua e compare com a nossa tabela.
| Medida do pé | Numeração |
|---|---|
| 26 cm | 39 |
| 26,7 cm | 40 |
| 27,4 cm | 41 |
| Medida do pé | 26 cm | 26,7 cm | 27,4 cm | 28 cm |
|---|---|---|---|---|
| Numeração | 39 | 40 | 41 | 42 |
Classes em assets/ds.css; exemplo real em snippets/lpa-size-guide.liquid.