Notion

Notebook tal-karta sħuna fix-xemx ta’ nofsinhar

L-interfaċċja ta' Notion tidher qisha notebook tal-karta maħbub fid-dawl tax-xemx: kanvas sħun u kremuż (#f6f5f4) li jħossu tattili aktar milli sterili, tipografija sans-serif ġeneruża li tagħti piż editorjali lill-kopja tal-prodott, u kulur użat bħala punteġġjatura skarsa—"pilloli" ħawħ jenfasizzaw il-verbi, blu wieħed jankra l-azzjoni ewlenija, u firxa rotanti ta' lewn aċċentwat (qroll, ambra, sema, nofsillejl) jikkulurixxu l-isfondi tal-karti bħal stikers. Il-karti huma rranġati fuq kanvas bi borduri u kantunieri rqaq—bla dellijiet, bla kromju—bħas-sezzjonijiet miksija ta' notebook Moleskine. L-animazzjoni hija ferrieħa u elastika, b'tranżizzjonijiet bla xkiel f'200ms u animazzjonijiet tal-karattri elastiċi li jagħtu l-ħajja lill-interfaċċja mingħajr ma jkunu dekorattivi.

Iċċentrat, il-wisa' massima hija limitata għal madwar 1440px. L-element prinċipali huwa munzell iċċentrat: ringiela ta' simboli → titlu kbir b'żewġ linji b'pillola kkulurita inkorporata → sottotitlu → ringiela b'żewġ buttuni ta' sejħa għall-azzjoni → mockup kbir tal-UI tal-prodott. Taħt l-element prinċipali, it-taqsimiet jalternaw bejn grilji ta' karti bojod u pannelli aċċentwati bil-kulur sħiħ. Il-ħajt tal-logo huwa grilja ċċentrata b'ringiela waħda ta' logos ta' msieħba fi skala griża. Il-blokki tal-karatteristiċi jużaw tqassim ta' żewġ kolonni (test fuq ix-xellug, pannell ikkulurit fuq il-lemin), li jalternaw mix-xellug għal-lemin bejn it-taqsimiet. It-taqsima "Staqsi lill-assistenti tiegħek fuq talba" tuża grilja ta' karti 2x2, fejn il-karta ta' fuq tieħu l-wisa' kollha, u r-ringiela t'isfel hija maqsuma f'żewġ kolonni ugwali. Il-kanali bejn it-taqsimiet huma ġenerużi (~80px), u joħolqu ritmu vertikali kalm. In-navigazzjoni hija bar ta' fuq fiss ta' 64px għoli b'elementi ta' navigazzjoni ċċentrati u buttuni ta' azzjoni allinjati mal-lemin.

L-illustrazzjonijiet huma importanti ħafna, mingħajr ritratti. Il-lingwaġġ viżwali huwa mibni fuq simboli ċatti u illustrati (trufijiet imdawwrin f'ċrieki kkuluriti ta' 2px), elementi dekorattivi astratti (disinji mħakkma bl-idejn, glitter, vleġeġ, forom ta' fjuri), u mockups tal-interfaċċja tal-utent tal-prodott. Is-simboli jidhru fit-tieqa prinċipali bħala ringiela orizzontali ta' seba' avatars u huma mxerrda mal-paġna bħala punteġġjatura umoristika. L-iskrinshots tal-prodott huma l-uniċi elementi viżwali "reali": juru l-interfaċċja attwali ta' Notion (Kanban boards, veduti tad-dokumenti, pannelli tal-aġenti tal-AI) b'sett sħiħ ta' elementi u dejta reali. Il-mockup tal-prodott fit-tieqa prinċipali huwa kbir, iċċentrat, u jitfa' dell wieħed li jisseparah mill-kanvas. M'hemm l-ebda ritratti tal-istil tal-ħajja, l-ebda immaġni tal-istokk, l-ebda renders 3D astratti.

SaaS Pura Minimalliżmu Editorjali

https://notion.so

Paletta

Marka

Notion Blue #0075de — L-element prinċipali li jimla l-buttuna tas-sejħa għall-azzjoni (CTA), aċċent fin-navigazzjoni attiva, il-buttuni ta' azzjoni mimlija huma l-unika skema ta' kuluri f'sistema kważi monokromatika li hija saturata biżżejjed biex tiġi pperċepita bħala swiċċ.

Newtrali

Paper Warmth #f6f5f4 — Il-kanvas tal-paġna, l-isfond tat-tieqa prinċipali, u l-isfond tas-sezzjoni huma kollha kuluri sħan, kemxejn beige li jagħtu lis-sistema sensazzjoni tattili u analoga.
Pure White #ffffff — Uċuħ tal-karti, pannelli mqajma, sfond tal-logo, test kuntrastanti fuq karti skuri.
Ink Black #000000 — Test prinċipali, links ta' navigazzjoni, intestaturi - użati b'trasparenza differenti (100%, 95%, 90%, 60%, 40%, 20%) biex tinbena ġerarkija mingħajr ma jiżdiedu kuluri ġodda.
Charcoal #111111 — Għażla ta' test skur għal dawk iż-żoni tal-UI fejn l-iswed pur jidher wisq aħrax.
Stone #757575 — Test ta' navigazzjoni sekondarja, test ta' għajnuna siekta, tikketti tal-buttuni diżattivati - 60% linka alfa
Graphite #615d59 — It-test prinċipali għandu ton sħun - griż kannella, li jarmonizza mal-isfond sħun.

Tipografija

minn 12 sa 96px · 10 passi

NotionInter — sostituzzjoni: Inter · linji gwida 400, 500, 600, 700 · Il-font sans-serif ewlieni huwa umanista ġeometriku b'sfumaturi sottili, użat f'daqsijiet 400 għat-test tal-ġisem, 500 għan-navigazzjoni/interfaċċja tal-utent, u 600-700 għat-titoli. L-iskala tal-font tuża spazjar negattiv aggressiv bejn l-ittri f'daqsijiet akbar (-4.6px f'96px, -2px f'72px), li jagħmel it-titlu jħossu aktar kompatt u kunfidenti, aktar milli ħafif.
Lyon Text — sostituzzjoni: Source Serif Pro · linji gwida 400 · It-tipa serif editorjali, riservata għal sezzjonijiet individwali tat-test prinċipali u introduzzjonijiet ta’ sezzjonijiet, tintuża bil-moderazzjoni (erba’ darbiet) biex tagħti lit-tipa piż letterarju, simili għal kwotazzjoni f’tqassim ta’ rivista. Tiffunzjona bħala aċċent sistemiku aktar milli bħala ġerarkija parallela.

Intervalli u forma

Skop	Tifsira
Densità	medja
Pass bażiku	8px
Raġġ tal-buttuna	8px
Raġġ tal-karta	12px
Dellijiet	le - fruntieri minflok dellijiet
Bejn is-sezzjonijiet	80px
Wisa' tal-paġna	1440px

L-AI se tibni l-websajt tiegħek fl-istil ta' Notion u timlieha

Imla bi prodotti u postijiet permezz tal-link - Instagram, TikTok, Facebook.
Ittrasferixxi l-kontenut mis-sit il-qadim tiegħek—speċifika biss l-indirizz.
Disinn modern fuq l-aqwa magna: React ( Next.js) b'rendering tas-server u ottimizzazzjoni SEO lesti għall-użu.
Ottimizzazzjoni SEO kompletament awtomatizzata għar-riżultati tat-tfittxija u rakkomandazzjonijiet tan-netwerk newrali.

Oħloq websajt f'dan l-istil

Stili simili

ElevenLabs — Esej bir-ritratti f'toni krema sħan b'titoli sottili. Notebook stil Bauhaus—karta kkulurita bħal qoxra tal-bajda, linka sewda, u aċċent wieħed vjola u oranġjo għall-wiri tal-prodott.
Awesomic — Xibka taż-żingu editorjali b'marki ta' punteġġjatura oranġjo li jfakkru fil-konfetti
Monad — ġurnal tekniku editorjali fuq parċmina sħuna
Dub — Il-pannell tal-kontroll tal-karta tar-ross matte ta' Link
Seline Analytics — Tabella analitika kwieta fuq karta sħuna
Anthropic — Ġurnal xjentifiku fuq il-post fuq vellum sħun—uċuħ kalmi tal-avorju, intestaturi editorjali b'serif, u aċċent wieħed tat-tafal li jidher biss meta tkun meħtieġa azzjoni.
Calendly — Linka blu skura fuq irħam kiesaħ
Augen Pro — Il-preżentazzjoni bajda ta' Apple tinkludi blu elettriku kliniku, bla piż bħala l-uniku aċċent fi spazju monokromu.
Antimetal — Kronaka editorjali fuq karta krema—għodwa kwieta f’ġurnal xjentifiku, fejn ir-rażan iwassal kunfidenza u s-serifs jagħmlu x-xogħol iebes
Perk — Ġir elettriku fuq karta parċmina sħuna
Ditto — Workshop imdawwal mix-xemx joħloq kampjuni ta' fjuri selvaġġi. Uċuħ krema sħan, kulur bażi isfar vibranti, linka blu skur, forom ta' kulur organiku jiffjorixxu wara l-biċċa.
Officevibe — Rivista editorjali fuq karta ta’ lewn krema sħun. Immaġina esej maħsub dwar il-ġestjoni tal-HR, ippreżentat bħala prodott—font serif kursiv li jxaqleb minn ġo interface blu moderna.