
Calendly
Sötétkék tinta hideg márványon
A Calendly egy nyugodt, magabiztos tervezési munkaterületnek érződik: egy majdnem fehér vászon rengeteg térrel a levegővételhez, éles fehér termékkártyák lebegnek a hűvös szürke háttér előtt, és az összes tipográfia sötétkék tintával, nem pedig tiszta feketével van renderelve. A meghatározó elem a sötétkék szín (#0b3558), amelyet mindenhol használnak a szövegben – címsorokban, gombokban, ikonokban, linkekben –, ami lágyítja az egész felületet, melegebbé és stílusosabbá téve azt, mint a tipikus SaaS landing page-ek. Egyetlen élénk kék szín (#006bff) kerül felhasználásra az összes elsődleges művelethez, és a termékelrendezéseken túlnyúló dekoratív rózsaszín és kék foltok melegséget kölcsönöznek anélkül, hogy rendetlenséget okoznának. Az összetevők visszafogottak: a vékony 1 képpontos szegélyek, a finom kékes árnyalatú árnyékok, a nagy, 24 képpontos kártyasugarak és a 8 képpontos gombsarkok inkább szándékosnak, mint unalmasnak érződnek.
Maximális szélesség 1200 képpont, középre igazítva, széles margókkal asztali gépen. A főképernyő két oszlopra oszlik: a bal oldali oszlop egy 80 képpontos fejlécet + szövegtörzset + egymásra halmozott bejelentkezési gombokat tartalmaz, míg a jobb oldali oszlop egy foglalási widget kártyát tartalmaz, háttérben díszítő elemekkel. A főképernyő alatt egyetlen, teljes szélességű csík található a Trust logóval. A következő szakaszok váltakoznak a középre igazított fejlécblokkok (H2 + alszöveg + opcionális cselekvésre ösztönzés) között, majd két oszlopos blokkok következnek, amelyek a funkciókat írják le (szöveg balra/termék jobbra vagy termék balra/szöveg jobbra), és minden termékkép mögött dekoratív hangsúlyelemek találhatók. A kártyarácsokat ritkán használják – az elrendezés a többoszlopos rácsok helyett a párosított szakaszokat részesíti előnyben. A szakaszok közötti távolság 48 és 64 képpont között változik. A navigáció egy 64 képpontos fix felső sáv, bal oldalon a logóval, jobb oldalon egy középre igazított menüvel és egy csoport cselekvésre ösztönzéssel.
A fő vizuális elem a termék képernyőképei – a foglalási naptár felhasználói felületének egyszerű makettjei, éles fehér kártyákon renderelve, széles, lekerekített sarkokkal. Dekoratív dizájn: minden termékkártyát koralllila (#e55cff) vagy azúrkék (#0099ff) lágy folt vesz körül, kissé eltolva és elmosva, kollázshatást keltve, nem pedig lapos képernyőképet. Nincsenek fényképek, nincsenek életstílus képek – minden vizuális elem a termék felhasználói felületét, absztrakt hangsúlyformákat vagy monokróm partnerlogókat ábrázol a megbízhatósági sávon. Az ikonok lineárisak, 1,5–2 képpontos vonalvastagsággal, monokrómak, sötétkék (tintakék) vagy kék (jelkék) színben.
Paletta
Márka
- Ink Navy
#0b3558— Fő szöveg, címsorok, ikonok, sötét háttér a cselekvésre ösztönzésekhez, navigációs linkek. - Signal Blue
#006bff— Elsődleges cselekvésre ösztönzés (CTA), aktív navigáció, linkkiemelés, kiválasztott állapotok
Semleges
- Carbon
#0a0a0a— Tiszta fekete szöveg (tartalék), logó karakterjel, ikon kitöltése. - Slate Gray
#476788— További fő szöveg, kiegészítő szöveg, némított címkék. - Mist Gray
#a6bbd1— Letiltott szöveg, inaktív funkciócímkék, világos ikon körvonalai - Cloud
#f8f9fb— Oldalvászon, lábléc háttere, extra felület - Paper
#ffffff— Kártyafelületek, kiemelt panelek, gombszöveg sötét háttéren. - Pebble
#f0f3f8— Háttérképek ikonokhoz, beviteli mező árnyékolás, finom elválasztók, lebegéseffektek.
Tipográfia
12-től 80 képpontig · 10 lépésben
- Gilroy — csere: Manrope · körvonalak 400, 500, 600, 700 · Minden kezelőfelületi szöveg. A Gilroy egy geometrikus humanista, talpatlan betűtípus széles nyílásokkal és egyenletes vonalkontraszttal; félkövér betűtípus-vastagságait (700) címsorokhoz, míg 500–600 közötti értékeket gombokhoz és alcímekhez használjuk. Cserélje le Manrope vagy Inter betűtípusra.
- Gilroy — csere: Inter · körvonalak 400 · Törzsszöveg és általános célú felhasználói felület címkéi – A 400 pontos betűvastagság biztosítja, hogy a hosszú szövegek olvashatóak legyenek anélkül, hogy nehézkesnek éreznék magukat.
- Gilroy — csere: Inter · körvonalak 500 · Másodlagos címsorok és kiemelt szövegtörzs – a 14/500-as betűméret az elsődleges eszköz a kártyák címsoraihoz és a soron belüli címkékhez.
Intervallumok és forma
| Cél | Jelentés |
|---|---|
| Sűrűség | sűrű |
| Alapvető lépés | 8-16px |
| Gomb sugara | 8px |
| Kártya sugara | 24px |
| Árnyékok | nincs - szegélyek árnyékok helyett |
| Szakaszok között | 48-64px |
| Oldal szélessége | 1200px |
A mesterséges intelligencia Calendly stílusban fogja elkészíteni a weboldaladat, és kitölti azt.
- Töltsd fel termékeidet és posztjaidat a linkeken keresztül - Instagram, TikTok, Facebook.
- Tartalom átvitele régi webhelyéről – csak adja meg a címet.
- Modern dizájn a legjobb keresőmotoron: React ( Next.js) szerveralapú rendereléssel és SEO optimalizálással, azonnal használható formában.
- Teljesen automatizált SEO optimalizálás a keresési eredményekhez és a neurális hálózati ajánlásokhoz.
Hasonló stílusok
- ElevenLabs — Meleg krémszínű fotóesszé visszafogott címekkel. Bauhaus stílusú jegyzetfüzet – tojáshéjszínű papír, fekete tinta és egyetlen lila és narancssárga díszítőelem a termékek bemutatásához.
- Awesomic — Szerkesztői cinkháló narancssárga írásjelekkel, konfettire emlékeztetve
- Monad — szerkesztőségi műszaki folyóirat meleg pergamenen
- Dub — Link matt rizspapír kezelőpanelje
- Seline Analytics — Egy csendes elemző asztal meleg papíron
- Notion — Egy meleg papírfüzet a déli napsütésben
- Anthropic — Tudományos terepnapló meleg pergamenen – nyugodt elefántcsont felületek, csíkos szerkesztői címsorok és egyetlen agyagdísz, amely csak akkor jelenik meg, ha cselekvésre van szükség.
- Augen Pro — Az Apple fehér prezentációjában a klinikai, súlytalan, elektromos kék szín az egyetlen hangsúly a monokróm térben.
- Antimetal — Krémszínű papíron szerkesztett krónika – egy csendes reggel egy tudományos folyóiratban, ahol a visszafogottság magabiztosságot sugall, és a betűsarok végzi a nehéz munkát.
- Perk — Elektromos lime meleg pergamenpapíron
- Ditto — Egy napsütötte műhely, ahol vadvirágmintákat készítenek. Meleg krémszínű felületek, élénk sárga alapszín, mély sötétkék tinták, organikus színformák virágoznak a darab mögött.
- Officevibe — Egy meleg krémszínű papíron megjelenő vezércikk. Képzeljen el egy elgondolkodtató esszét a HR-menedzsmentről, amelyet termékként mutat be – egy modern kék kezelőfelületen suttogó, talpas, folyóírással írt betűtípus.