Seline Analytics
Isang tahimik na analytical table sa mainit na papel
Ang Seline ay nakalagay laban sa isang mainit na background na bato (#fafaf9) na may iisang matingkad na asul na accent—lahat ng iba pang mga kulay ay neutral at kinuha mula sa paleta ng kulay ng batong Tailwind. Ang mga headline ay inilalabas sa isang pasadyang dinisenyong geometric sans-serif font (roobert) na may bigat na 400 at makitid na espasyo sa mga negatibong letra, na nagbibigay sa teksto ng isang maginhawa, halos parang bulong na kumpiyansa na kaibahan sa karaniwang maingay na istilo ng SaaS. Ang mga UI surface ay mga patag na puting card, na lumulutang sa ibabaw ng mainit na background na may iisang malambot, 16px na blur; ang mga border ay nilikha gamit ang manipis, 1px na mga linyang may kulay bato, na malawakang ginagamit bilang pangunahing elemento ng istruktura kapalit ng mabibigat na divider o panel. Ang layout ay nagbibigay-inspirasyon: ang buong lapad na nilalaman ay nakasentro sa isang masaganang patayong ritmo, na may mga interactive na kontrol na hugis-pill, isang ilustrasyon ng mascot para sa personalidad, at mga screenshot ng dashboard bilang patunay ng produkto. Ang pangkalahatang impresyon ay editoryal na analitikal: kalmado, monochrome, kumpiyansa, kung saan ang asul na panawagan sa aksyon ang pinakakapansin-pansing elemento sa pahina salamat sa sadyang pagpipigil sa lahat ng iba pa.
Ang pahina ay may pinakamataas na lapad, nakasentro sa humigit-kumulang 1200px na may sapat na patayong espasyo. Ang hero ay isang dalawang-linya, nakahanay sa kaliwa na bloke ng teksto na may iisang naka-highlight na parirala ("simple at epektibo") na kulay asul, na sinusundan ng isang hilera na may dalawang panawagan para sa aksyon (blue pill + ghost pill), pagkatapos ay isang hilera ng mga logo ng kasosyo na naka-grayscale, pagkatapos ay isang hilera ng mga rating ng tiwala, at pagkatapos ay isang full-width na lumulutang na preview ng dashboard, na bahagyang nagpapatong-patong sa susunod na seksyon. Sa ibaba ng fold ay may mga salit-salit na hilera ng mga testimonial sa isang grid na may iisang hanay, na sinusundan ng mga full-width na seksyon na may mga paglalarawan ng feature, nakahanay sa kaliwa na teksto, at mga visual ng produkto na nakasentro. Ang nabigasyon ay isang minimalistang top bar—logo sa kaliwa, nakasentrong mga link sa nabigasyon, login + asul na panawagan para sa aksyon sa kanan—na may lumulutang na kumpol ng mga avatar sa gitna ng nabigasyon na nagsisilbing pag-verify ng pagkakakilanlan. Malawak ang mga espasyo sa pagitan ng mga seksyon (96px) upang lumikha ng ritmo ng editoryal sa halip na isang siksik na halo-halong impormasyon.
Ang biswal na wika ay pinangungunahan ng mga screenshot ng user interface ng produkto—ang preview ng dashboard ay isang litratong ni-render gamit ang grayscale (1) (0.94) contrast filter, na nagpapatahimik sa mga kulay ng data sa isang monochrome hue. Ang tanging pigura ng tao ay isang linear mascot sticker (isang karakter na may hood), na iginuhit sa istilo ng SVG na may mga balangkas lamang, inilalagay nang isang beses bawat seksyon bilang isang mapaglarong kontrapunto sa analytical content, na may malambot na anino upang lumikha ng mala-sticker na epekto ng lalim. Ang logo ng brand at mga glyph ay maliliit na itim na spark/flame. Walang mga litrato—walang mga lifestyle shot, walang mga larawan ng team, walang mga larawan sa kapaligiran. Ang bagay (ang dashboard) ang bida. Lahat ng mga pandekorasyon na icon ay 1px outline style sa alinman sa #0c0a09 o #3ba6f1, hindi kailanman pinupunan.
Paleta
Tatak
- Cyan Signal
#3ba6f1— Ang pangunahing panawagan para sa aksyon, mga aktibong link, at balangkas ng mga icon ng brand ang tanging mga kulay na nagbibigay-diin sa pahina, na bihirang gamitin upang maakit ang atensyon sa aksyon. - Cyan Edge
#3398e1— Ginagamit ang asul upang i-highlight ang mga balangkas ng aksyon, mga label ng link, at mga interactive na elemento. Hindi ito dapat gamitin bilang pangunahing kulay para sa mga panawagan para sa aksyon.
Neutral
- Ink Black
#0c0a09— Ang mga pangunahing pamagat, naka-highlight na katawan ng teksto, at mga nagpapahayag na icon ay nasa mainit, halos itim na kulay. - Stone Canvas
#fafaf9— Ang background ng pahina ay isang mainit at kremang kulay na parang papel ang dating sa halip na puti ng screen. - Pure White
#ffffff— Ang mga ibabaw ng mapa, mga nakausling panel, at mga pagpuno ng input field ay patag at walang anino bilang default. - Stone Border
#e8e6e5— Ang mga manipis na hangganan sa mga card, nabigasyon, at mga input field ang pangunahing elementong istruktural, hindi mga separator. - Stone Muted
#d6d3d1— Karagdagang mga frame, mga banayad na kulay ng background, mga pandekorasyon na divider. - Ash Gray
#a8a29e— Teksto ng tulong, mga balangkas ng icon, mga estadong hindi pinagana - nababasa ngunit hindi aktibo.
Tipograpiya
mula 10 hanggang 52px · 5 hakbang
- Roobert — kapalit: Inter Tight or Satoshi · mga balangkas 400, 500 · Ang font para sa mga heading at layout ng teksto ay isang natatanging geometric sans-serif na may kaunting espasyo para sa mga negatibong letra (-0.025em sa 32px, -0.021em sa 52px). Ang bigat na 400 x 52px ang siyang lagda ng font: hindi pangkaraniwan, banayad, ngunit makapangyarihan, ngunit simple. Naookupa ng mga heading ang kanilang lugar nang hindi nagiging labis-labis.
- Inter — kapalit: Inter · mga balangkas 400, 500, 600 · Ang pangunahing font para sa body text, nabigasyon, UI, at mga heading ay isang neutral at unibersal na font para sa lahat ng off-screen na teksto. 14px na may bigat na 400 at line spacing na 1.64 ang pangunahing laki para sa body text (dalas na 1174). Ang positive letter spacing (0.004em) sa maliliit na sukat ay nagsisiguro ng madaling mabasang UI.
Mga pagitan at anyo
| Layunin | Kahulugan |
|---|---|
| Densidad | maluwang |
| Pangunahing hakbang | 8px |
| Radius ng buton | 9999px |
| Radius ng card | 10px |
| Mga anino | malambot na anino |
| Sa pagitan ng mga seksyon | 96px |
| Lapad ng pahina | 1200px |
Gagawa ang AI ng website mo sa estilong Seline Analytics 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
- 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.
- Calendly — Madilim na asul na tinta sa malamig na marmol
- 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.