Calendly
Madilim na asul na tinta sa malamig na marmol
Ang Calendly ay parang isang kalmado at may kumpiyansang workspace sa pagpaplano: isang halos puting canvas na may maraming espasyo para sa paghinga, mga malulutong na puting product card na lumulutang laban sa malamig na kulay abong background, at lahat ng tipograpiya ay ginawa gamit ang maitim na asul na tinta sa halip na purong itim. Ang nagpapakilalang elemento ay ang maitim na asul na kulay (#0b3558), na ginagamit sa lahat ng lugar na lumalabas ang teksto—mga headline, button, icon, link—na nagpapalambot sa buong interface, ginagawa itong mas mainit at mas naka-istilo kaysa sa karaniwang SaaS landing page. Isang matingkad na asul (#006bff) ang ginagamit para sa lahat ng pangunahing aksyon, at ang mga pandekorasyon na pink at asul na splash na lumalampas sa mga layout ng produkto ay nagdaragdag ng init nang hindi lumilikha ng kalat. Ang mga bahagi ay pinananatiling simple: manipis na 1px na mga border, banayad na asul na mga anino, malalaking 24px na radius ng card, at 8px na mga sulok ng button ay parang sinasadya sa halip na walang laman.
Pinakamataas na lapad na 1200px, nakasentro, na may malalapad na margin sa desktop. Ang pangunahing screen ay nahahati sa dalawang column: ang kaliwang column ay naglalaman ng 80px na header + body text + mga stacked login button, habang ang kanang column ay naglalaman ng booking widget card na may mga pandekorasyon na elemento sa background. Sa ibaba ng pangunahing screen ay isang single, full-width na stripe na may Trust logo. Ang mga kasunod na seksyon ay nagpapalitan sa pagitan ng mga nakasentrong header block (H2 + subtext + opsyonal na call to action), na sinusundan ng mga two-column block na naglalarawan ng mga feature (text left/product right o product left/text right) na may mga pandekorasyon na accent elements sa likod ng bawat larawan ng produkto. Bihirang gamitin ang mga card grid—mas pinapaboran ng layout ang mga pares na seksyon na magkakatabi kaysa sa mga multi-column grid. Ang pagitan sa pagitan ng mga seksyon ay mula 48 hanggang 64px. Ang navigation ay isang 64px na nakapirming top bar na may logo sa kaliwa, isang nakasentrong menu, at isang grupo ng mga call to action sa kanan.
Ang pangunahing biswal na elemento ay mga screenshot ng produkto—mga simpleng mockup ng user interface ng kalendaryo ng pag-book, na ipinapakita sa mga malulutong na puting card na may malalapad at bilugan na sulok. Disenyo ng dekorasyon: ang bawat product card ay napapalibutan ng malambot na bahagi ng coral purple (#e55cff) o azure blue (#0099ff), bahagyang nakahiwalay at malabo, na lumilikha ng collage effect sa halip na isang patag na screenshot. Walang mga litrato, walang mga larawan sa pamumuhay—lahat ng biswal na elemento ay kumakatawan sa user interface ng produkto, mga abstract accent shape, o mga monochrome partner logo sa trust bar. Ang mga icon ay linear na may lapad ng linya na 1.5–2px, monochrome, sa maitim na asul (Ink Navy) o asul (Signal Blue).
Paleta
Tatak
- Ink Navy
#0b3558— Pangunahing teksto, mga heading, mga icon, madilim na background para sa mga panawagan para sa aksyon, mga link sa nabigasyon. - Signal Blue
#006bff— Pangunahing panawagan para sa aksyon (CTA), aktibong nabigasyon, diin sa link, mga piling estado
Neutral
- Carbon
#0a0a0a— Teksto sa purong itim (fallback), logo glyph, icon fill. - Slate Gray
#476788— Karagdagang pangunahing teksto, sumusuportang teksto, mga naka-mute na label. - Mist Gray
#a6bbd1— Hindi pinaganang teksto, mga label ng hindi aktibong function, mga balangkas ng icon na ilaw - Cloud
#f8f9fb— Kanbas ng pahina, background ng footer, karagdagang ibabaw - Paper
#ffffff— Mga ibabaw ng card, nakataas na mga panel, teksto ng button sa madilim na background. - Pebble
#f0f3f8— Mga larawan sa background para sa mga icon, shading ng input field, mga banayad na separator, mga hover effect.
Tipograpiya
mula 12 hanggang 80px · 10 hakbang
- Gilroy — kapalit: Manrope · mga balangkas 400, 500, 600, 700 · Teksto na puro interface. Ang Gilroy ay isang geometric humanist sans-serif na may malalawak na butas at pare-parehong contrast ng stroke; ang mga naka-bold na timbang nito (700) ay ginagamit para sa mga heading, habang ang 500–600 ay ginagamit para sa mga buton at subheading. Palitan ng Manrope o Inter.
- Gilroy — kapalit: Inter · mga balangkas 400 · Body text at mga pangkalahatang-gamit na UI label - Tinitiyak ng 400-point na bigat ng font na mababasa ang mahahabang teksto nang hindi mabigat.
- Gilroy — kapalit: Inter · mga balangkas 500 · Mga pangalawang heading at naka-highlight na body text - 14/500 na font ang pangunahing gamit para sa mga heading ng card at mga inline na label.
Mga pagitan at anyo
| Layunin | Kahulugan |
|---|---|
| Densidad | siksik |
| Pangunahing hakbang | 8-16px |
| Radius ng buton | 8px |
| Radius ng card | 24px |
| Mga anino | walang - mga hangganan sa halip na mga anino |
| Sa pagitan ng mga seksyon | 48-64px |
| Lapad ng pahina | 1200px |
Gagawa ang AI ng website mo sa estilong Calendly at pupunuin ito
- Punuin ng mga produkto at post gamit ang link - Instagram, TikTok, Facebook.
- Maglipat ng nilalaman mula sa iyong lumang site—tukuyin lamang ang address.
- Modernong disenyo gamit ang pinakamahusay na engine: React ( Next.js) na may kasamang server rendering at SEO optimization na agad-agad.
- Ganap na awtomatikong pag-optimize ng SEO para sa mga resulta ng paghahanap at mga rekomendasyon sa neural network.
Mga katulad na estilo
- ElevenLabs — Isang photo essay sa maayang kulay krema na may banayad na mga headline. Isang notebook na istilong Bauhaus—papel na kulay itlog, itim na tinta, at isang lila at orange na accent para sa display ng produkto.
- Awesomic — Editoryal na zinc mesh na may orange na bantas na nakapagpapaalala ng confetti
- Monad — teknikal na dyornal ng editoryal tungkol sa mainit na pergamino
- Dub — Control panel ng Link na gawa sa matte rice paper
- Seline Analytics — Isang tahimik na analytical table sa mainit na papel
- Notion — Isang mainit na kuwaderno na papel sa ilalim ng araw ng tanghali
- Anthropic — Isang siyentipikong field journal sa mainit na vellum—mga kalmadong ibabaw na garing, mga serif na heading editoryal, at isang natatanging accent na luwad na lumilitaw lamang kapag kinakailangan ng aksyon.
- Augen Pro — Ang puting presentasyon ng Apple ay nagtatampok ng klinikal, magaan, at de-kuryenteng asul bilang tanging accent sa isang monochrome na espasyo.
- Antimetal — Isang kronikong editoryal sa kremang papel—isang tahimik na umaga sa isang siyentipikong dyornal, kung saan ang pagtitimpi ay naghahatid ng kumpiyansa at ang mga serif ang siyang nagpapabigat
- Perk — Electric lime sa mainit na parchment paper
- Ditto — Isang workshop na naliliwanagan ng araw na lumilikha ng mga sample ng wildflower. Mainit na kremang ibabaw, matingkad na dilaw na kulay, malalim na asul na tinta, mga organikong kulay na namumukadkad sa likod ng obra.
- Officevibe — Isang magasin na editoryal sa mainit at kulay kremang papel. Isipin ang isang maalalahaning sanaysay tungkol sa pamamahala ng HR, na inilalahad bilang isang produkto—isang cursive serif font na bumubulong sa isang modernong asul na interface.