Calendly
Tmavomodrý atrament na studenom mramore
Calendly pôsobí ako pokojný a sebavedomý pracovný priestor na plánovanie: takmer biele plátno s dostatkom priestoru na dýchanie, svieže biele karty produktov plávajúce na chladnom sivom pozadí a všetka typografia vykreslená tmavomodrým atramentom namiesto čisto čiernej. Určujúcim prvkom je tmavomodrá farba (#0b3558), ktorá sa používa všade, kde sa objavuje text – nadpisy, tlačidlá, ikony, odkazy – a zjemňuje celé rozhranie, vďaka čomu je teplejšie a štýlovejšie ako typická vstupná stránka SaaS. Pre všetky primárne akcie sa používa jedna jasne modrá farba (#006bff) a dekoratívne ružové a modré škvrny presahujúce rozloženie produktov dodávajú teplo bez toho, aby vytvárali neporiadok. Komponenty sú nenápadné: tenké 1px okraje, jemné modré tiene, veľké 24px polomery kariet a 8px rohy tlačidiel pôsobia skôr zámerne ako nevýrazne.
Maximálna šírka 1200px, vycentrované, so širokými okrajmi na ploche. Hlavná obrazovka je rozdelená do dvoch stĺpcov: ľavý stĺpec obsahuje 80px hlavičku + text tela + naskladané prihlasovacie tlačidlá, zatiaľ čo pravý stĺpec obsahuje kartu rezervačného widgetu s dekoratívnymi prvkami na pozadí. Pod hlavnou obrazovkou sa nachádza jeden pás s logom Trust na celú šírku. Následné sekcie sa striedajú medzi vycentrovanými blokmi hlavičky (H2 + podtext + voliteľná výzva na akciu), za ktorými nasledujú dvojstĺpcové bloky popisujúce funkcie (text vľavo/produkt vpravo alebo produkt vľavo/text vpravo) s dekoratívnymi akcentovými prvkami za každým obrázkom produktu. Mriežky kariet sa používajú zriedkavo – rozloženie uprednostňuje spárované sekcie umiestnené vedľa seba pred viacstĺpcovými mriežkami. Rozstupy medzi sekciami sa pohybujú od 48 do 64px. Navigácia je tvorená 64px pevným horným panelom s logom vľavo, vycentrovaným menu a skupinou výziev na akciu vpravo.
Hlavným vizuálnym prvkom sú snímky obrazovky produktu – jednoduché makety používateľského rozhrania rezervačného kalendára, vykreslené na sviežich bielych kartách so širokými, zaoblenými rohmi. Dekoratívny dizajn: každá karta produktu je obklopená jemnou škvrnou koralovo fialovej (#e55cff) alebo azúrovo modrej (#0099ff), mierne odsadenou a rozmazanou, čím sa vytvára skôr kolážový efekt než plochá snímka obrazovky. Žiadne fotografie, žiadne obrázky životného štýlu – všetky vizuálne prvky predstavujú používateľské rozhranie produktu, abstraktné akcentové tvary alebo monochromatické logá partnerov na paneli dôveryhodnosti. Ikony sú lineárne so šírkou čiary 1,5 – 2 pixely, monochromatické, v tmavomodrej (Ink Navy) alebo modrej (Signal Blue) farbe.
Paleta
Značka
- Ink Navy
#0b3558— Hlavný text, nadpisy, ikony, tmavé pozadie pre výzvy na akciu, navigačné odkazy. - Signal Blue
#006bff— Primárna výzva na akciu (CTA), aktívna navigácia, dôraz na odkaz, vybrané stavy
Neutrálny
- Carbon
#0a0a0a— Text v čisto čiernej farbe (záložný), logotyp, výplň ikonou. - Slate Gray
#476788— Doplnkový hlavný text, podporný text, stlmené popisky. - Mist Gray
#a6bbd1— Zakázaný text, označenia neaktívnych funkcií, obrysy svetelných ikon - Cloud
#f8f9fb— Plátno stránky, pozadie päty, extra povrch - Paper
#ffffff— Povrchy kariet, vyvýšené panely, text tlačidiel na tmavom pozadí. - Pebble
#f0f3f8— Obrázky na pozadí pre ikony, tieňovanie vstupných polí, jemné oddeľovače, efekty vznášania sa.
Typografia
od 12 do 80px · 10 krokov
- Gilroy — náhrada: Manrope · obrysy 400, 500, 600, 700 · Všetok text rozhrania. Gilroy je geometrické humanistické bezpätkové písmo so širokými otvormi a rovnomerným kontrastom ťahov; jeho tučné písmo (700) sa používa pre nadpisy, zatiaľ čo 500 – 600 sa používa pre tlačidlá a podnadpisy. Nahraďte písmom Manrope alebo Inter.
- Gilroy — náhrada: Inter · obrysy 400 · Hlavný text a všeobecné popisky používateľského rozhrania – hrúbka písma 400 bodov zaisťuje, že dlhé texty sú čitateľné bez toho, aby pôsobili ťažkopádne.
- Gilroy — náhrada: Inter · obrysy 500 · Sekundárne nadpisy a zvýraznený text tela – písmo 14/500 je primárnym nástrojom pre nadpisy kariet a vložené popisky.
Intervaly a forma
| Účel | Význam |
|---|---|
| Hustota | hustý |
| Základný krok | 8-16px |
| Polomer tlačidla | 8px |
| Polomer karty | 24px |
| Tiene | nie - okraje namiesto tieňov |
| Medzi sekciami | 48-64px |
| Šírka stránky | 1200px |
Umelá inteligencia vytvorí vašu webovú stránku v štýle Calendly a naplní ju
- Doplňte produktmi a príspevkami cez odkaz - Instagram, TikTok, Facebook.
- Preneste obsah zo svojej starej stránky – stačí zadať adresu.
- Moderný dizajn na najlepšom engine: React ( Next.js) s vykresľovaním servera a SEO optimalizáciou hneď po vybalení.
- Plne automatizovaná SEO optimalizácia pre výsledky vyhľadávania a odporúčania neurónových sietí.
Podobné štýly
- ElevenLabs — Fotoesej v teplých krémových tónoch s jemnými nadpismi. Zápisník v štýle Bauhaus – papier farby vaječnej škrupiny, čierny atrament a jeden fialovo-oranžový akcent na vystavenie produktov.
- Awesomic — Redakčná zinková sieťovina s oranžovými interpunkčnými znamienkami pripomínajúcimi konfety
- Monad — redakčný technický časopis na teplom pergamene
- Dub — Ovládací panel z matného ryžového papiera Link
- Seline Analytics — Tichý analytický stôl na teplom papieri
- Notion — Teplý papierový zápisník na poludňajšom slnku
- Anthropic — Vedecký časopis z oblasti teplého pergamenu – pokojné slonovinové povrchy, pätkové úvodné nadpisy a jediný hlinený prízvuk, ktorý sa objavuje iba vtedy, keď je potrebná akcia.
- Augen Pro — Biela prezentácia spoločnosti Apple sa vyznačuje klinickou, beztiažovou, elektrickou modrou ako jediným akcentom v monochromatickom priestore.
- Antimetal — Redakčná kronika na krémovom papieri – tiché ráno vo vedeckom časopise, kde zdržanlivosť vyjadruje sebavedomie a pätkové písmo robí ťažkú prácu.
- Perk — Elektrické vápno na teplom pergamenovom papieri
- Ditto — Slnečná dielňa, kde sa tvoria vzorky divých kvetov. Teplé krémové povrchy, žiarivá žltá základná farba, sýto tmavomodré atramenty, organické farebné formy kvitnúce za dielom.
- Officevibe — Redakčný časopis na teplom krémovom papieri. Predstavte si premyslenú esej o riadení ľudských zdrojov, prezentovanú ako produkt – kurzívne pätkové písmo šepkajúce cez moderné modré rozhranie.