Tokens, componentes, padrões de seção e regras de uso. Esta é a fonte única de verdade para qualquer landing page, página de vendas, site institucional ou app da Entrelaços Psicologia.
A landing page Cohort Inverno 2026 reúne todas as decisões deste sistema — 11 dobras, regra de 3 do laranja, inversão cream, Lorenz, constellation. É a referência de teste-de-cheiro.
A versão clara da Cohort Inverno — fundo cream, manifesto em zona escura invertida, hero com rede interativa. Para LPs comerciais e sistemas web que vendem para empresas.
Todo o sistema é construído sobre três decisões nucleares. Quem violar qualquer uma delas está fazendo outra m...
Abrir → 02A logo Entrelaços traduz a marca em três sinais: as duas asas em roxo (entrelaçar), o ponto laranja no centro ...
Abrir → 03A Entrelaços fala como quem já viu, já fez, e ainda escolhe acreditar. Confronto que abre escolha — nunca conf...
Abrir →A escala foi calibrada para que --e-purple-600 seja o tom de CTAs e destaques, --e-purple-900/950 para fundos ...
Abrir → 05Inter Tight para sans tight, Instrument Serif para italic editorial, JetBrains Mono para labels técnicas. A "a...
Abrir → 06Toda seção respira a mesma quantidade. Toda card tem padding mínimo de 32px. Esse rigor é o que faz o sistema ...
Abrir → 07A geometria diferencia famílias de componente. Botões e badges são pílulas. Cards são retângulos suaves de 20p...
Abrir → 08Toda sombra de identidade combina inset hairline branco + glow roxo translúcido. Isso é o que diferencia visua...
Abrir → 09Tudo respira na mesma curva. Tudo aparece com o mesmo reveal. A coerência de motion é o que faz o sistema sent...
Abrir → 09+ · NOVO18 efeitos prontos para LPs e sites — reveal, stagger, magnetic, tilt, ripple, shimmer, parallax. Cada um com snippet HTML/CSS/JS copiável.
Copiar snippets →CTAs primários sempre roxo-600 com inset hairline + glow. Ghost para secundários. Link para terciários. Varian...
Abrir → 11Três variantes. O chip carrega ações pequenas com dot-glow. O dash é mais discreto. O separator é para trust s...
Abrir → 12O card é a unidade de conteúdo padrão. Sempre 20px de raio, 32px de padding mínimo, índice mono opcional, e sp...
Abrir → 13Use stats em grupos de 4, mono no número, mono em CAPS no label. O counter anima de 0 ao valor com cubic-out 1...
Abrir → 14Input é entrada de dado, não ação. Por isso é quadrado — diferente de botões e badges. Focus ring é halo roxo ...
Abrir → 15Badges são pílulas pequenas em mono. Roxo é o default. Laranja é reservado para urgência genuína (segue a regr...
Abrir → 16Pílula flutuante, fixed top, com backdrop-blur e inset hairline. Encolhe sutilmente após 32px de scroll — econ...
Abrir → 17Os componentes assinatura da marca — onde a metáfora vira interação. Use com parcimônia: no máximo um por pági...
Abrir → 17+ · NOVOModais, toasts, tabs, accordion, dropdowns, switches, skeletons. A segunda camada para construir sistemas web. Com theme toggle ao vivo.
Abrir → 17++ · NOVOSistema de ícones oficial — traço 2px, grid 24, currentColor. 24 ícones de marca prontos para copiar.
Abrir →A copy precisa respeitar a onda emocional. Não pular dobras sem razão estratégica. Não colar CTA hard antes da...
Abrir → 19A copy da Entrelaços não vende — convida. Não promete faturamento — devolve dignidade. CTAs ranqueados do soft...
Abrir → 20Cada dobra responde a uma pergunta interna do leitor. A LP cria uma onda — quebrar a ordem é quebrar a transfo...
Abrir →Algumas decisões são preferência. Estas não são. Cruzar qualquer uma delas é fazer outra marca, não Entrelaços...
Abrir → 22A Entrelaços é uma marca que fala em dignidade. A acessibilidade não é checklist — é coerência ética com o man...
Abrir → 23Sete passos. Se você seguir, sai uma página que parece da marca. Se pular qualquer um, sai um SaaS roxo.
Abrir →
Social
Templates de carrossel
4 estruturas de carrossel (educacional, manifesto, programa, provas) em Feed 4:5 e Stories/Reels 9:16, com export PNG em resolução nativa.
Abrir →