Design System - Colchão pra Mim
Sistema de design completo para a primeira marca de colchões personalizados do Brasil. Construído sobre tokens de design bem definidos, componentes reutilizáveis e uma abordagem mobile-first.
Paleta de Cores
Cores Primárias
Variações do Verde Primário
Variações do Ouro Primário
Neutros & Semânticos
Gradientes
Sistema de Tipografia
Escala tipográfica completa usando Nunito do Google Fonts.
Display Hero (56px, Extrabold)
Linha: 1.2 | Espaçamento: -0.02em
Heading 1 (40px, Bold)
Linha: 1.2 | Espaçamento: -0.02em
Heading 2 (32px, Bold)
Linha: 1.2
Heading 3 (24px, Semibold)
Linha: 1.2
Heading 4 (20px, Semibold)
Linha: 1.5
Body Large (18px, Regular) - Use este tamanho para texto destacado e introdutório. Fornece excelente legibilidade em displays maiores. Linha: 1.5
Body (16px, Regular) - Este é o tamanho padrão para conteúdo principal. Otimizado para leitura confortável em qualquer dispositivo. Linha: 1.5
Body Small (14px, Regular) - Para texto secundário, metadados e rótulos. Linha: 1.5
Caption (12px, Regular) - Para notas de rodapé, legendas e informações auxiliares. Linha: 1.5
Botões
Variantes de Botão
Tamanhos de Botão
Estados de Botão
Cards
Card de Feature
Customização
120+ combinações personalizadas baseadas em sua análise biomecânica individual.
Teste Gratuito
100 noites de teste em sua própria cama. Devolvemos o investimento se não ficar satisfeito.
Garantia 10 Anos
Cobertura completa contra defeitos de fabricação e problemas estruturais.
Card de Testemunho
Card de Processo
Análise
Responda a questionário detalhado sobre seu corpo e preferências.
Consultoria
Converse com especialista em biomecânica do sono.
Montagem
Seu colchão é montado sob medida em nosso laboratório.
Entrega
Entrega gratuita e instalação em sua casa.
Elementos de Formulário
Badges & Tags
Badges de Confiança
Tags de Categoria
Badges Semânticos
Accordion / FAQ
Você responde a um questionário detalhado sobre seu corpo, peso, posição ao dormir e preferências de firmeza. Nossos especialistas em biomecânica analisam suas respostas e criam uma configuração única de espumas e materiais que se adapta perfeitamente ao seu corpo.
Sim! Oferecemos 100 noites de teste sem risco. Se não estiver completamente satisfeito, devolvemos o valor integral sem fazer perguntas. Sabemos que o colchão perfeito é aquele que você escolhe confortavelmente em sua própria cama.
Nossos colchões são projetados para durar 10 anos ou mais com os devidos cuidados. Oferecemos garantia de 10 anos contra defeitos de fabricação e problemas estruturais. Com limpeza regular e rotação, você pode estender ainda mais a vida útil.
Entrega gratuita em toda a região metropolitana de São Paulo. Nossos especialistas desempacolham, instalam na sua cama e removem as embalagens. Para outras regiões, oferecemos entrega com custo reduzido com montagem gratuita.
Nossa consultoria recomenda firmeza com base em seu peso, posição ao dormir e histórico de dores. Pessoas mais pesadas geralmente preferem firmeza maior, enquanto quem dorme de lado prefere algo mais macio. Responda honestamente ao questionário para melhores recomendações.
Guia de Ícones
Ícones devem seguir estilo outline com traço de 2px, cantos arredondados e tamanho mínimo de 24px.
Satisfação
Comunicação
Casa
Opções
Análise
Proteção
Contato
Tempo
Diretrizes de Ícones
- Estilo: Outline com traço de 2px
- Tamanho base: Múltiplos de 24px (24, 32, 48, 64px)
- Cantos: Radius 2-4px para acabamento polido
- Proporção: 1:1 (quadrado)
- Espaçamento interno: Mínimo 2px de padding do viewport
- Cores: Usar cores semânticas ou variações primárias
- Alinhamento: Sempre aligned ao grid de 24px