Calendly
Inchiostro blu scuro su marmo freddo
Calendly trasmette una sensazione di calma e sicurezza, tipica di uno spazio di lavoro per la pianificazione: una tela quasi bianca con ampi spazi, schede prodotto bianche e nitide che si stagliano su uno sfondo grigio freddo e tutta la tipografia resa con un inchiostro blu scuro anziché nero puro. L'elemento distintivo è il colore blu scuro (#0b3558), utilizzato ovunque compaia del testo (titoli, pulsanti, icone, link), che ammorbidisce l'intera interfaccia, rendendola più calda ed elegante rispetto alla tipica landing page di un SaaS. Un unico blu brillante (#006bff) è utilizzato per tutte le azioni principali, e tocchi decorativi rosa e blu che si estendono oltre i layout dei prodotti aggiungono calore senza creare confusione. I componenti sono mantenuti sobri: bordi sottili di 1 pixel, ombreggiature leggermente blu, ampi raggi delle schede di 24 pixel e angoli dei pulsanti di 8 pixel trasmettono una sensazione di cura e non di banalità.
Larghezza massima 1200px, centrata, con ampi margini su desktop. La schermata principale è divisa in due colonne: la colonna di sinistra contiene un'intestazione di 80px + testo del corpo + pulsanti di accesso sovrapposti, mentre la colonna di destra contiene una scheda widget per le prenotazioni con elementi decorativi sullo sfondo. Sotto la schermata principale è presente una singola striscia a tutta larghezza con il logo Trust. Le sezioni successive si alternano tra blocchi di intestazione centrati (H2 + sottotesto + invito all'azione opzionale), seguiti da blocchi a due colonne che descrivono le caratteristiche (testo a sinistra/prodotto a destra o prodotto a sinistra/testo a destra) con elementi decorativi di accento dietro ogni immagine del prodotto. Le griglie a schede sono usate raramente: il layout privilegia sezioni accoppiate posizionate una accanto all'altra piuttosto che griglie a più colonne. La spaziatura tra le sezioni varia da 48 a 64px. La navigazione è costituita da una barra superiore fissa di 64px con il logo a sinistra, un menu centrato e un gruppo di inviti all'azione a destra.
L'elemento visivo principale è costituito da screenshot del prodotto: semplici mockup dell'interfaccia utente del calendario di prenotazione, realizzati su cartoncini bianchi nitidi con angoli ampi e arrotondati. Design decorativo: ogni scheda prodotto è circondata da una delicata macchia viola corallo (#e55cff) o blu azzurro (#0099ff), leggermente decentrata e sfocata, che crea un effetto collage anziché un semplice screenshot. Nessuna fotografia, nessuna immagine di lifestyle: tutti gli elementi visivi rappresentano l'interfaccia utente del prodotto, forme astratte decorative o loghi monocromatici dei partner sulla barra di fiducia. Le icone sono lineari con uno spessore di 1,5-2 pixel, monocromatiche, in blu scuro (Ink Navy) o blu (Signal Blue).
Tavolozza
Marca
- Ink Navy
#0b3558— Testo principale, intestazioni, icone, sfondo scuro per le call to action, link di navigazione. - Signal Blue
#006bff— Invito all'azione principale (CTA), navigazione attiva, enfasi sul link, stati selezionati
Neutro
- Carbon
#0a0a0a— Testo in nero puro (opzione di ripiego), glifo del logo, riempimento con icona. - Slate Gray
#476788— Testo principale aggiuntivo, testo di supporto, etichette attenuate. - Mist Gray
#a6bbd1— Testo disabilitato, etichette delle funzioni inattive, contorni delle icone chiari - Cloud
#f8f9fb— Tela della pagina, sfondo del piè di pagina, superficie extra - Paper
#ffffff— Superfici delle carte, pannelli in rilievo, testo dei pulsanti su sfondo scuro. - Pebble
#f0f3f8— Immagini di sfondo per icone, ombreggiatura dei campi di input, separatori discreti, effetti al passaggio del mouse.
Tipografia
da 12 a 80px · 10 passaggi
- Gilroy — sostituzione: Manrope · contorni 400, 500, 600, 700 · Tutto il testo dell'interfaccia. Gilroy è un sans-serif umanista geometrico con ampie aperture e contrasto uniforme dei tratti; i suoi pesi grassetto (700) sono usati per i titoli, mentre 500–600 sono usati per pulsanti e sottotitoli. Sostituire con Manrope o Inter.
- Gilroy — sostituzione: Inter · contorni 400 · Testo del corpo ed etichette dell'interfaccia utente generiche: il peso del carattere di 400 punti garantisce che i testi lunghi siano leggibili senza risultare pesanti.
- Gilroy — sostituzione: Inter · contorni 500 · Intestazioni secondarie e testo del corpo evidenziato: il carattere 14/500 è lo strumento principale per le intestazioni delle schede e le etichette in linea.
Intervalli e forma
| Scopo | Senso |
|---|---|
| Densità | denso |
| Passo base | 8-16px |
| Raggio del pulsante | 8px |
| Raggio della carta | 24px |
| Ombre | no - bordi invece di ombre |
| Tra le sezioni | 48-64px |
| Larghezza del pannello | 1200px |
L'IA creerà il tuo sito web nello stile Calendly e lo riempirà
- Pubblica prodotti e contenuti tramite il link: Instagram, TikTok, Facebook.
- Trasferisci i contenuti dal tuo vecchio sito: basta specificare l'indirizzo.
- Design moderno sul miglior motore: React ( Next.js) con rendering lato server e ottimizzazione SEO integrata.
- Ottimizzazione SEO completamente automatizzata per i risultati di ricerca e raccomandazioni basate su reti neurali.
Stili simili
- ElevenLabs — Un reportage fotografico dai toni caldi color crema con titoli delicati. Un taccuino in stile Bauhaus: carta color guscio d'uovo, inchiostro nero e un unico accento viola e arancione per la presentazione del prodotto.
- Awesomic — Rete metallica in zinco per uso editoriale con segni di punteggiatura arancioni che ricordano i coriandoli.
- Monad — Rivista tecnica editoriale sulla pergamena calda
- Dub — Pannello di controllo in carta di riso opaca di Link
- Seline Analytics — Un tranquillo tavolo analitico su carta calda
- Notion — Un quaderno di carta calda sotto il sole di mezzogiorno
- Anthropic — Un diario scientifico da campo su calda pergamena: superfici color avorio, titoli editoriali con grazie e un unico accento color argilla che compare solo quando è necessario intervenire.
- Augen Pro — La presentazione bianca di Apple presenta un blu elettrico, clinico e impalpabile, come unico accento in uno spazio monocromatico.
- Antimetal — Una cronaca editoriale su carta color crema: una tranquilla mattinata in una rivista scientifica, dove la sobrietà trasmette sicurezza e i caratteri serif svolgono il lavoro più impegnativo.
- Perk — Calce elettrica su carta da forno calda
- Ditto — Un laboratorio illuminato dal sole dove si creano campioni di fiori selvatici. Superfici color crema caldo, una base di colore giallo vibrante, inchiostri blu scuro intenso, forme di colore organiche che sbocciano sullo sfondo dell'opera.
- Officevibe — Una rivista editoriale stampata su carta color crema caldo. Immaginate un saggio approfondito sulla gestione delle risorse umane, presentato come un prodotto: un carattere serif corsivo che sussurra attraverso un'interfaccia blu moderna.