Área de proteção
Um módulo ao redor da marca preserva leitura.
Design system
Calma com presença.
Cuidado sem pressa.
Fundamentos e componentes exclusivos do Lumê Casa de Cuidado, separados da LG e da Vila Miolo.
- 5cores semânticas
- 2famílias tipográficas
- 8 ptbase de espaçamento
- AAmeta de contraste
01 · Marca
Uma casa que acolhe, nunca uma vitrine idealizada.
lumêcasa de cuidado
O símbolo combina gota, gesto e respiração. A assinatura “Seu tempo, por inteiro” equilibra energia e autonomia sem prometer aparência.
Movimento
A gota pode marcar transições e assinaturas.
Não fazer
Não distorcer, contornar ou aplicar sobre ruído.
02 · Paleta
Cores com trabalho definido.
A paleta diferencia base, ação, acolhimento e equilíbrio. A argila rosada não vira decoração indiscriminada: sinaliza ação e calor.
Ameixa profunda
Base e intimidade
#3f1731Argila rosada
Ação e calor
#c76767Rosa seco
Acolhimento
#d7a5a0Creme luminoso
Respiro
#faf4eaVerde-sálvia
Equilíbrio
#aebda603 · Tipografia
Presença editorial.
Leitura humana.
Seu tempo, por inteiro.
A serifada de alto contraste (Cormorant) dá o tom editorial e caloroso dos títulos, com itálico como acento. A humanista Karla sustenta navegação, formulários e leitura longa.
TítulosCormorant serifada
InterfaceKarla humanista
EscalaResponsiva
04 · Estrutura
Espaçamento, grid e forma.
Uma base consistente evita que cada página pareça um novo projeto.
Escala de espaço
Múltiplos de 8 px organizam respiro interno e ritmo vertical.
Grid responsivo
Doze colunas no desktop, seis no tablet e quatro no mobile.
Arcos orgânicos
Cantos em arco (1.8–2.6rem) e molduras arqueadas vêm da arquitetura da casa.
Sombras
Elevação única e suave em tom ameixa: 0 14px 40px rgb(63 23 49/.08).
05 · Fotografia
Pessoas e contexto antes da pose.
Mulheres diversas, movimentos plausíveis, luz natural e relações de orientação. Nunca usar antes/depois, sexualização ou corpo idealizado como promessa.
06 · Iconografia
Arcos, gotas e gestos de cuidado.
SVG 24×24, traço de 1.6 px em currentColor e terminações arredondadas — mesmo padrão técnico do portfólio, com motivos exclusivos da marca.
Acolher
Porta em arco da casa
Escutar
Conversa com afeto
Combinar
Cuidados que se sobrepõem
Cuidar
Coração
Confirmar
Agenda com confirmação humana
07 · Componentes
Estados fazem parte do componente.
Botões, cards, tabelas, formulários e disclosures preservam foco visível, contraste e área mínima de toque.
Cards
Imagem, contexto, descrição e ação formam uma unidade navegável.
Formulários
Rótulos persistentes, validação compreensível e resultado anunciado.
Disclosures
Dados fictícios e limites aparecem próximos da decisão.
Veja o sistema aplicado, não apenas documentado.
Site, Instagram e motion usam os mesmos fundamentos.