A fonte de verdade da nossa identidade: clínica, confiável e moderna. Uma base neutra em escala de cinza, um acento laranja firme e uma família roxa para dados. Cada tela do produto deve parecer parte deste mesmo sistema.
Um produto SaaS premium para profissionais de saúde. A energia vem do contraste, não da saturação.
A base em escala de cinza mantém os dados médicos legíveis e calmos. Nada barulhento, nada estéril.
O laranja sinaliza ação: CTAs, badges e destaques. Usado com moderação para criar contraste.
A família fria roxo/lilás conduz a visualização de dados e os acentos secundários, sempre com intenção.
Um produto preciso e premium para a saúde. Refinado — nunca barulhento ou brincalhão.
Archivo para toda a UI; Erode (serif) reservada para o h1 editorial. Os títulos vêm em peso medium, tracking justo e equilibrados — nunca gritantes.
Archivo (body e UI) · Erode (display h1). Nunca importe Google Fonts nem adicione novas famílias.
Inteligência médica em que você pode confiar
Feito para equipes clínicas
Respostas médicas verificadas com fontes, prontas para o fluxo de trabalho real.
98.6%
Atualizado com a evidência mais recente
Tokens semânticos para tudo (o dark mode funciona automaticamente). A paleta de marca é reservada para CTAs, badges, destaques e visualização de dados.
brand-warm-100brand-warm-200brand-warm-300brand-warm-400brand-warm-500brand-cool-100brand-cool-200brand-cool-300brand-resolutebrand-accentbrand-darkbrand-lightbg-backgroundtext-foregroundbg-primarybg-secondarybg-mutedbg-accentbg-cardborder-borderbg-successbg-warningbg-destructivering-ringComponha sobre components/ui/* antes de construir sob medida. Um único RainbowButton como CTA principal por tela; todo o resto permanece calmo.
Gaste o orçamento de animação em um reveal de carregamento orquestrado e um único elemento focal. Todo o resto permanece calmo e respeita prefers-reduced-motion.
| Uso | Duração | Easing |
|---|---|---|
| Hover cor/transform | 150–200ms | ease-in-out |
| Reveal / crossfade | 300–400ms | ease-out / easeInOut |
| Painéis deslizantes | 300ms | cubic-bezier(0.87,0,0.13,1) |
| Loops de ambiente | 2s–50s | linear infinite |
Na dúvida, imite a landing page. Tokens semânticos em vez de hex, duas fontes, dark mode obrigatório e motion contido. Este documento vence qualquer estética gerada.
Voltar ao produto