Calendly
Tinta azul escura sobre mármore frio
O Calendly transmite uma sensação de espaço de planejamento calmo e confiante: uma tela quase branca com bastante espaço livre, cartões de produtos brancos e nítidos flutuando sobre um fundo cinza frio, e toda a tipografia renderizada em tinta azul escura em vez de preto puro. O elemento definidor é a cor azul escura (#0b3558), usada em todos os lugares onde o texto aparece — títulos, botões, ícones, links — o que suaviza toda a interface, tornando-a mais acolhedora e elegante do que a típica página de destino de SaaS. Um único azul brilhante (#006bff) é usado para todas as ações principais, e toques decorativos em rosa e azul que se estendem além dos layouts dos produtos adicionam calor sem criar poluição visual. Os componentes são discretos: bordas finas de 1px, sombras sutis com tonalidade azul, raios de cartão grandes de 24px e cantos de botão de 8px parecem intencionais em vez de banais.
Largura máxima de 1200px, centralizado, com margens amplas em desktops. A tela principal é dividida em duas colunas: a coluna da esquerda contém um cabeçalho de 80px + texto principal + botões de login empilhados, enquanto a coluna da direita contém um cartão de widget de reserva com elementos decorativos ao fundo. Abaixo da tela principal, há uma faixa única de largura total com o logotipo da Trust. As seções subsequentes alternam entre blocos de cabeçalho centralizados (H2 + subtexto + chamada para ação opcional), seguidos por blocos de duas colunas descrevendo recursos (texto à esquerda/produto à direita ou produto à esquerda/texto à direita) com elementos decorativos de destaque atrás de cada imagem de produto. Grades de cartões são raramente usadas — o layout prioriza seções em pares colocadas lado a lado em vez de grades de várias colunas. O espaçamento entre as seções varia de 48 a 64px. A navegação consiste em uma barra superior fixa de 64px com o logotipo à esquerda, um menu centralizado e um grupo de chamadas para ação à direita.
O principal elemento visual são as capturas de tela do produto — maquetes simples da interface do usuário do calendário de reservas, renderizadas em cartões brancos nítidos com cantos largos e arredondados. Design decorativo: cada cartão de produto é circundado por um toque suave de roxo coral (#e55cff) ou azul celeste (#0099ff), ligeiramente deslocado e desfocado, criando um efeito de colagem em vez de uma captura de tela plana. Sem fotografias, sem imagens de estilo de vida — todos os elementos visuais representam a interface do usuário do produto, formas abstratas de destaque ou logotipos monocromáticos de parceiros na barra de confiança. Os ícones são lineares, com uma largura de linha de 1,5 a 2 px, monocromáticos, em azul escuro (Ink Navy) ou azul (Signal Blue).
Paleta
Marca
- Ink Navy
#0b3558— Texto principal, títulos, ícones, fundo escuro para chamadas à ação, links de navegação. - Signal Blue
#006bff— Chamada principal para ação (CTA), navegação ativa, ênfase em links, estados selecionados
Neutro
- Carbon
#0a0a0a— Texto em preto puro (formato alternativo), glifo do logotipo, preenchimento do ícone. - Slate Gray
#476788— Texto principal adicional, texto de apoio, rótulos silenciados. - Mist Gray
#a6bbd1— Texto desativado, rótulos de funções inativas, contornos de ícones claros - Cloud
#f8f9fb— Tela da página, fundo do rodapé, superfície extra - Paper
#ffffff— Superfícies de cartão, painéis em relevo, texto em botões sobre fundo escuro. - Pebble
#f0f3f8— Imagens de fundo para ícones, sombreamento de campos de entrada, separadores sutis, efeitos de foco.
Tipografia
de 12 a 80px · 10 etapas
- Gilroy — substituição: Manrope · esboços 400, 500, 600, 700 · Todo o texto da interface. Gilroy é uma fonte sans-serif humanista geométrica com espaçamento amplo e contraste uniforme entre os traços; suas versões em negrito (700) são usadas para títulos, enquanto as versões 500–600 são usadas para botões e subtítulos. Substitua por Manrope ou Inter.
- Gilroy — substituição: Inter · esboços 400 · Texto corrido e rótulos de interface de usuário de uso geral - a espessura da fonte de 400 pontos garante que textos longos sejam legíveis sem parecerem pesados.
- Gilroy — substituição: Inter · esboços 500 · Títulos secundários e texto corrido destacado - a fonte 14/500 é a principal ferramenta para títulos de cartões e rótulos em linha.
Intervalos e forma
| Propósito | Significado |
|---|---|
| Densidade | denso |
| Passo básico | 8-16px |
| Raio do botão | 8px |
| Raio do cartão | 24px |
| Sombras | não - bordas em vez de sombras |
| Entre seções | 48-64px |
| Largura da página | 1200px |
A IA criará seu site no estilo Calendly e o preencherá.
- Compartilhe produtos e publicações através dos links - Instagram, TikTok, Facebook.
- Transfira o conteúdo do seu site antigo — basta especificar o endereço.
- Design moderno na melhor engine: React ( Next.js) com renderização no servidor e otimização de SEO integradas.
- Otimização de SEO totalmente automatizada para resultados de pesquisa e recomendações de redes neurais.
Estilos semelhantes
- ElevenLabs — Um ensaio fotográfico em tons creme quentes com títulos sutis. Um caderno em estilo Bauhaus — papel cor de casca de ovo, tinta preta e um único detalhe em roxo e laranja para exibição do produto.
- Awesomic — Tela editorial em zinco com marcas de pontuação laranja que lembram confete.
- Monad — revista técnica editorial sobre pergaminho quente
- Dub — Painel de controle de papel de arroz fosco do Link
- Seline Analytics — Uma mesa analítica silenciosa sobre papel quente
- Notion — Um caderno de papel quente sob o sol do meio-dia
- Anthropic — Uma revista científica de campo impressa em pergaminho de tom quente — superfícies de marfim sereno, títulos editoriais com serifa e um único detalhe em tom de barro que aparece apenas quando é necessário dar o que falar.
- Augen Pro — A apresentação branca da Apple destaca um azul elétrico, clínico e leve, como único elemento de destaque em um espaço monocromático.
- Antimetal — Uma crônica editorial em papel creme — uma manhã tranquila em uma revista científica, onde a sobriedade transmite confiança e as serifas desempenham um papel fundamental.
- Perk — Cal elétrica em papel pergaminho quente
- Ditto — Uma oficina ensolarada criando amostras de flores silvestres. Superfícies em tons creme quentes, uma vibrante cor de base amarela, tintas em um profundo azul marinho, formas orgânicas de cores desabrochando ao fundo da obra.
- Officevibe — Uma revista editorial impressa em papel creme de tom quente. Imagine um ensaio instigante sobre gestão de RH, apresentado como um produto — uma fonte cursiva serifada que sussurra através de uma interface azul moderna.