Modal
Un terminal fosforescent într-o cameră de servere întunecată - singura sursă de lumină este o culoare verde strălucitor
Funcțiile modale sunt similare cu cele ale unui terminal fosforescent într-o cameră de servere întunecată: o pânză aproape neagră, font verde pal și un singur accent verde-lime strălucitor care acționează ca un indicator LED de stare. Limbajul de design este axat pe dezvoltator - ferestre de cod monospațiate cu puncte de semafor, pictograme 3D izometrice în verdele caracteristic și mult spațiu alb, permițând câte un element din fiecare secțiune să strălucească. Tipografia este împărțită între un font personalizat (Goga) pentru titluri și un font variabil (Inter) pentru toate elementele interfeței utilizator, ambele setate cu urmărire negativă îngustă. Culorile sunt distribuite uniform: majoritatea ecranelor sunt acromatice, iar culoarea verde-lime strălucitoare apare doar pe acțiunile cheie, pe logo, pe ilustrațiile 3D și pe momentele de accentuare. Componentele sunt plate și fără rame, cu adâncime creată prin margini verzi subtile și estompare a fundalului, mai degrabă decât prin umbre.
Modalul folosește un layout întunecat pe toată lățimea, cu o lățime maximă de 1280px, pentru a acomoda conținutul. Fereastra principală este centrată: titlul (prima propoziție în verde lime), un subtitlu, două îndemnuri la acțiune și un singur obiect 3D ca ancoră vizuală - fără a separa layout-ul de bara laterală. Secțiunile de conținut urmează un ritm uniform: etichetă sprânceană (litere majuscule, Moss 70) → titlu Goga → text discret, apoi fie un layout pe două coloane cu o descriere a caracteristicii (text + cod/card vizual), fie o grilă pe trei coloane de carduri. Marginile dintre secțiuni sunt generoase - 80px. Pagina alternează între dungi goale adânci (#000000) și dungi de fundal puțin mai deschise (#181818), cu o secțiune deschisă (#def0dd) care apare în mijlocul paginii ca o pauză vizuală. Navigarea constă dintr-o singură bară superioară fixă, cu un fundal neclar - fără bară laterală sau mega-meniu. Subsolul este compact și întunecat, cu coloane de linkuri verzi discrete. Densitatea textului este confortabilă: fiecare secțiune are suficient spațiu, iar grilele de cartonașe nu utilizează mai mult de trei coloane.
Limbajul vizual al Modal este împărțit în două moduri: randări 3D strălucitoare ale produselor și machete întunecate ale ferestrelor de cod. Punctul focal este un singur cub 3D randat folosind un gradient de marketing (de la verde lime la smarald), plasat într-un halou radial de gradient care scaldă spațiul gol în lumină verde - stilul vizual caracteristic al mărcii. Fișele Workload conțin pictograme 3D izometrice (un cub wireframe, o scară solidă, straturi) redate în același verde lime pe un fundal întunecat. Rezultatele codului și ale testelor de performanță sunt prezentate ca fișe de fereastră terminală cu puncte semafor, evidențiere monospațiată a sintaxei într-o paletă fosforescentă și o bordură verde estompată - acestea seamănă cu capturi de ecran ale unei interfețe reale de linie de comandă. Logo-urile clienților sunt afișate ca etichete desaturate verde-gri într-un singur rând cu contrast redus, semnalând încredere fără concurență vizuală. Densitatea generală este scăzută - majoritatea paginilor conțin predominant text, iar imaginile sunt prezentate ca puncte focale individuale, mai degrabă decât ca grile de fotografii. Nu există fotografii; întregul sistem vizual este randat, geometric și radiant.
Paletă
Marca
- Lime Pulse
#7fee64— Elementele principale ale identității corporative sunt logo-ul, îndemnul principal la acțiune (CTA), umplerea tag-urilor, stările active și culoarea de bază a ilustrației.
Neutru
- Phosphor White
#ddffdc— Textul principal, culoarea titlului, conturul pictogramei și textul umplut al butonului reprezintă principala suprafață lizibilă. - Void Black
#000000— Pânza paginii, cel mai profund strat de fundal - Ground Iron
#181818— Umplutura butonului principal, suprafețele cardurilor în zonele întunecate, suprafața de bază a interfeței utilizator. - Carbon Veil
#212525— Suprafețe ridicate, fundal de navigație, puțin mai deschise decât solul. - Circuit Border
#485346— Cadrul de acțiune contur/fantomă, linia subțire interactivă principală, are o nuanță gri-verzui estompată. - Phosphor Blue-Black
#1f2a33— Linii secundare subțiri de marcare, care împart liniile între dungi întunecate.
Tipografie
de la 12 la 64px · 8 pași
- Goga — înlocuire: Inter Tight or Space Grotesk · contururi 400, 500 · Font pentru titluri și subtitluri – Se utilizează pentru toate titlurile și cărțile de joc H1–H4. Goga este un font sans-serif geometric personalizat, cu aperturi înguste și terminale ușor pătrate. Grosimea medie (500) este rezervată pentru evidențierea titlurilor la nivel de carte; grosimea normală (400) este utilizată pentru titlurile de eroi și secțiuni. Pentru a accesa formele alternative de glife care definesc identitatea Modal, trebuie activat setul stilistic „ss01”. Spațierea negativă a literelor scade treptat de la -0,007em la 48px la -0,017em la 21px.
- Inter Variable — înlocuire: Inter · contururi 400, 500 · Interfața utilizator și corpul paginii – navigare, butoane, corpul paginii, etichete, subsol. În mod implicit, se folosește grosimea medie (500) pentru elementele interactive și navigare; grosimea normală (400) se folosește pentru paragrafe. Spațierea dintre litere este redusă considerabil chiar și la dimensiuni mici (-0,026em la 14px, -0,022em la 16px), conferind interfeței o densitate condensată, terminală. Pentru punctuație alternativă, ar trebui inclusă varianta de caracter „cv11”. Etichetele scrise numai cu majuscule la 12px utilizează o spațiere între litere de +0,05em pentru a contrabalansa densitatea corpului paginii.
Intervale și formă
| Scop | Sens |
|---|---|
| Densitate | medie |
| Pasul de bază | 20px |
| Raza butonului | 12px |
| Raza cardului | 8px |
| Umbre | fără - margini în loc de umbre |
| Între secțiuni | 80px |
| Lățimea paginii | 1280px |
Inteligența artificială vă va construi site-ul web în stilul Modal și îl va completa
- Completează cu produse și postări prin link - Instagram, TikTok, Facebook.
- Transferați conținut de pe vechiul site - specificați doar adresa.
- Design modern pe cel mai bun motor: React ( Next.js) cu randare pe server și optimizare SEO gata de utilizare.
- Optimizare SEO complet automatizată pentru rezultatele căutării și recomandări de rețele neuronale.
Stiluri similare
- Slash — Boltă de la miezul nopții cu registre aurite
- AgentQL — Aurora boreală deasupra terminalului noaptea
- GitHub — Un panou de comandă spațială cu puncte de control bioluminescente — un spațiu de lucru întunecat și atmosferic, unde o singură strălucire verde indică drumul înainte.
- Doppler — Iluminarea violetă a seifului la miezul nopții. Pânza aproape neagră strălucește cu un singur semnal lavandă și o lumină verde de confirmare, fiecare suprafață fiind suficient de curbată pentru a fi apucată.
- Basedash — Un terminal de date de la miezul nopții cu font mat. Un observator întunecat unde indicatorii de performanță strălucesc violet și verde, titlurile cu serife plutesc deasupra zgomotului, iar butoanele albe în formă de pastilă sunt singurele obiecte luminoase într-o cameră cu suprafețe negre și moi.
- Superwhisper — Aurora boreală se dizolvă peste paharul de la miezul nopții
- Better Stack — Consola SRE de la miezul nopții
- Langbase — Consola Midnight Northern Lights
- Astro — Centrul de Control al Misiunii Spațiale Deep Space cu o singură strălucire violetă provenită de la o nebuloasă
- Wayfinder — Un ecran de film negru cu un titlu abia auzit care plutește deasupra unei ilustrații live. Interfața este un cursor de luminozitate, mai degrabă decât un panou de control.
- HashiCorp — Camera de control la miezul nopții, cu neon violet, este o suprafață tehnică întunecată, unde un cub hexagonal strălucitor servește drept singura referință de culoare.
- Umbrel — Un foc de tabără confortabil în camera serverelor de noapte - o cameră întunecată unde o singură strălucire deschisă la culoare evidențiază ceea ce este cu adevărat important.