Telegram, WhatsApp+380637610482
Valery Danyuk
Valery DanyukdesenvolvedorDesenvolvemento de ferramentas de IA para empresas. Alta calidade. Asequible.Escribir en Telegram
Calendly — unha vista previa dun sitio con este estilo

Calendly

Tinta azul escura sobre mármore frío

Calendly parécese a un espazo de traballo de planificación tranquilo e seguro: unha lona case branca con moito espazo para respirar, tarxetas de produto brancas nítidas flotando sobre un fondo gris frío e toda a tipografía renderizada nunha tinta azul escura en lugar de negro puro. O elemento definitorio é a cor azul escura (#0b3558), que se usa en todos os lugares onde aparece texto (titulares, botóns, iconas, ligazóns), o que suaviza toda a interface, facéndoa máis cálida e elegante que a típica páxina de destino SaaS. Úsase un único azul brillante (#006bff) para todas as accións principais, e as salpicaduras decorativas de rosa e azul que se estenden máis alá dos deseños dos produtos engaden calidez sen crear desorde. Os compoñentes mantéñense discretos: bordos finos de 1 px, sombras sutís de cor azul, radios de tarxetas grandes de 24 px e esquinas de botóns de 8 px parecen deliberadas en lugar de sos.

Anchura máxima de 1200 px, centrada, con marxes amplas no escritorio. A pantalla principal está dividida en dúas columnas: a columna esquerda contén unha cabeceira de 80 px + texto do corpo + botóns de inicio de sesión apilados, mentres que a columna dereita contén unha tarxeta de widget de reserva con elementos decorativos ao fondo. Debaixo da pantalla principal hai unha única franxa de ancho completo co logotipo de Trust. As seccións posteriores alternan entre bloques de cabeceira centrados (H2 + subtexto + chamada á acción opcional), seguidos de bloques de dúas columnas que describen características (texto esquerda/produto dereita ou produto esquerda/texto dereita) con elementos de acento decorativo detrás de cada imaxe do produto. As cuadrículas de tarxetas úsanse raramente: o deseño favorece as seccións emparelladas colocadas unha ao lado da outra en lugar de cuadrículas de varias columnas. O espazado entre as seccións varía de 48 a 64 px. A navegación é unha barra superior fixa de 64 px co logotipo á esquerda, un menú centrado e un grupo de chamadas á acción á dereita.

O elemento visual principal son as capturas de pantalla do produto: maquetas sinxelas da interface de usuario do calendario de reservas, representadas en tarxetas brancas nítidas con esquinas anchas e redondeadas. Deseño decorativo: cada tarxeta de produto está rodeada por unha suave mancha de cor púrpura coral (#e55cff) ou azul celeste (#0099ff), lixeiramente desprazada e borrosa, creando un efecto de colaxe en lugar dunha captura de pantalla plana. Sen fotografías, sen imaxes de estilo de vida: todos os elementos visuais representan a interface de usuario do produto, formas de acento abstractas ou logotipos monocromos de socios na barra de confianza. As iconas son lineais cun ancho de liña de 1,5 a 2 px, monocromas, en azul escuro (azul mariño tinta) ou azul (azul sinal).

Paleta

Marca

  • Ink Navy #0b3558 — Texto principal, títulos, iconas, fondo escuro para chamadas á acción, ligazóns de navegación.
  • Signal Blue #006bff — Chamada á acción principal (CTA), navegación activa, énfase na ligazón, estados seleccionados

Neutro

  • Carbon #0a0a0a — Texto en negro puro (alternativo), glifo do logotipo, recheo de iconas.
  • Slate Gray #476788 — Texto principal adicional, texto de apoio, etiquetas silenciadas.
  • Mist Gray #a6bbd1 — Texto desactivado, etiquetas de funcións inactivas, contornos de iconas de luz
  • Cloud #f8f9fb — Lenzo da páxina, fondo do pé de páxina, superficie adicional
  • Paper #ffffff — Superficies de tarxetas, paneis en relevo, texto de botóns sobre un fondo escuro.
  • Pebble #f0f3f8 — Imaxes de fondo para iconas, sombreado de campos de entrada, separadores sutís, efectos de desprazamento.

Tipografía

de 12 a 80 px · 10 pasos

  • Gilroy — substitución: Manrope · contornos 400, 500, 600, 700 · Todo o texto da interface. Gilroy é unha sans-serif humanista xeométrica con amplas aberturas e un contraste uniforme de trazos; os seus grosores en negra (700) úsanse para os títulos, mentres que os de 500 a 600 se usan para os botóns e subtítulos. Substitúa por Manrope ou Inter.
  • Gilroy — substitución: Inter · contornos 400 · Texto do corpo e etiquetas de interface de usuario de uso xeral: o grosor da fonte de 400 puntos garante que os textos longos sexan lexibles sen que parezan pesados.
  • Gilroy — substitución: Inter · contornos 500 · Títulos secundarios e texto destacado: a fonte 14/500 é a ferramenta principal para os títulos das tarxetas e as etiquetas en liña.

Intervalos e forma

PropósitoSignificado
Densidadedenso
Paso básico8-16px
Radio do botón8px
Radio da tarxeta24px
Sombrassen bordos en vez de sombras
Entre seccións48-64px
Largura da páxina1200px

A IA creará o teu sitio web ao estilo de Calendly e o encherá

  • Enche con produtos e publicacións a través da ligazón: Instagram, TikTok, Facebook.
  • Transfire contido do teu sitio antigo: só tes que especificar o enderezo.
  • Deseño moderno no mellor motor: React ( Next.js) con renderización de servidor e optimización SEO listas para usar.
  • Optimización SEO totalmente automatizada para resultados de busca e recomendacións de redes neuronais.

Estilos semellantes

  • ElevenLabs — Un ensaio fotográfico en tons crema cálidos con titulares sutís. Un caderno de estilo Bauhaus: papel cor casca de ovo, tinta negra e un único detalle morado e laranxa para a exhibición do produto.
  • Awesomic — Malla editorial de zinc con signos de puntuación laranxas que lembran confeti
  • Monad — revista técnica editorial en pergamiño quente
  • Dub — Panel de control de papel de arroz mate de Link
  • Seline Analytics — Unha mesa analítica tranquila sobre papel quente
  • Notion — Un caderno de papel quente ao sol do mediodía
  • Anthropic — Unha revista científica de campo sobre pergamiño cálido: superficies de marfil tranquilas, títulos editoriais con serigrafía e un único acento de arxila que só aparece cando é necesario actuar.
  • Augen Pro — A presentación branca de Apple presenta un azul eléctrico, clínico e lixeiro como único acento nun espazo monocromático.
  • Antimetal — Unha crónica editorial en papel cor crema: unha mañá tranquila nunha revista científica, onde a moderación transmite confianza e as serifas fan o traballo pesado
  • Perk — Lima eléctrica sobre papel pergamiño quente
  • Ditto — Un obradoiro soleado creando mostras de flores silvestres. Superficies crema cálidas, unha cor base amarela vibrante, tintas azul mariño intenso, formas de cor orgánicas que florecen detrás da peza.
  • Officevibe — Unha revista editorial en papel de cor crema cálida. Imaxina un ensaio reflexivo sobre a xestión de recursos humanos, presentado como un produto: unha fonte cursiva serif que susurra a través dunha interface azul moderna.