
Modal
Fosforestseeruv terminal pimendatud serveriruumis - ainus valgusallikas on erkroheline värv
Modaalne kujundus toimib nagu fosforestseeruv terminal pimedas serveriruumis: peaaegu must lõuend, kahvaturoheline tekst ja üks ere laimiroheline aktsent, mis toimib LED-olekuindikaatorina. Disainikeel on arendajakeskne – ühtlase asetusega koodiaknad valgusfooripunktidega, isomeetrilised 3D-ikoonid signatuurrohelises värvitoonis ja palju tühja ruumi, mis võimaldab igas jaotises ühel elemendil helendada. Tüpograafia on jagatud kohandatud fondi (Goga) jaoks pealkirjade jaoks ja muutuva fondi (Inter) jaoks kõigi kasutajaliidese elementide jaoks, mõlemad on seatud kitsa negatiivse jälgimisega. Värvid on jaotatud ühtlaselt: enamik ekraane on akromaatilise taustaga ja ere laimiroheline värv ilmub ainult võtmetoimingutel, logol, 3D-illustratsioonidel ja rõhuasetusega hetkedel. Komponendid on lamedad ja raamita, sügavus luuakse peente roheliste ääriste ja tausta hägususe, mitte varjude abil.
Modaalaken kasutab sisu mahutamiseks täislaiuses tumedat paigutust maksimaalse laiusega 1280 pikslit. Põhiaken on tsentreeritud: pealkiri (esimene lause laimirohelises toonis), alapealkiri, kaks kutset tegevusele ja üks 3D-objekt visuaalse ankruna – ilma paigutust külgribast eraldamata. Sisuosad järgivad ühtset rütmi: kulmumärk (suurtähed, Moss 70) → Goga pealkiri → summutatud põhitekst, seejärel kas kaheveeruline paigutus funktsioonikirjeldusega (tekst + kood/visuaalne kaart) või kolmeveeruline kaartide ruudustik. Sektsioonide vahelised äärised on helded – 80 pikslit. Lehel vahelduvad sügavad tühjad (#000000) ja veidi heledama taustaga (#181818) triibud, lehe keskel on visuaalseks hingetõmbepausiks üks hele osa (#def0dd). Navigeerimine koosneb ühest fikseeritud ülemisest ribast häguse taustaga – külgriba ega megamenüüd pole. Jalus on kompaktne ja tume, summutatud roheliste lingiveerudega. Teksti tihedus on mugav: igale osale on antud piisavalt ruumi ja kaardiruudud ei kasuta rohkem kui kolme veergu.
Modali visuaalne keel jaguneb kaheks režiimiks: 3D-helendavad tooterenderdused ja tumedate koodiakende maketid. Fookuspunktiks on üks 3D-kuup, mis on renderdatud turundusgradiendiga (laimirohelisest smaragdroheliseni), mis on paigutatud radiaalse gradiendiga halo sisse, mis ujutab tühja ruumi rohelises valguses – brändi signatuurne visuaalne stiil. Töökoormuskaardid sisaldavad isomeetrilisi 3D-ikoone (traatvõrgust kuup, tahke trepp, kihid), mis on renderdatud samas laimirohelises toonis tumedal taustal. Koodi ja võrdlustulemused esitatakse terminaliaknakaartidena, millel on valgusfoori punktid, fosforestseerivas paletis ühesuunaline süntaksi esiletõstmine ja summutatud roheline ääris – need meenutavad päris käsurealiidese ekraanipilte. Klientide logod kuvatakse küllastumata rohekashallide siltidena ühes madala kontrastsusega reas, mis annab märku usaldusest ilma visuaalse konkurentsita. Üldine tihedus on madal – enamik lehti sisaldab valdavalt teksti ja pilte esitatakse üksikute fookuspunktidena, mitte fotode ruudustikuna. Fotosid pole; kogu visuaalne süsteem on renderdatud, geomeetriline ja kiirgav.
Palett
Bränd
- Lime Pulse
#7fee64— Ettevõtte identiteedi peamised elemendid on logo, peamine üleskutse tegutsemisele (CTA), siltide täitmine, aktiivsed olekud ja illustratsiooni põhivärv.
Neutraalne
- Phosphor White
#ddffdc— Põhitekst, pealkirja värv, ikooni kontuur ja täidetud nuputekst on peamised loetavad pinnad. - Void Black
#000000— Lehekülje lõuend, sügavaim taustakiht - Ground Iron
#181818— Põhinuppude täitmine, kaardipinnad tumedatel aladel, kasutajaliidese aluspind. - Carbon Veil
#212525— Kõrgemad pinnad, navigatsioonitaust, maapinnast veidi heledam. - Circuit Border
#485346— Peamine interaktiivne õhuke joon, kontuuri/kummitusraami kujutis, on summutatud rohekashall. - Phosphor Blue-Black
#1f2a33— Teised õhukesed märgistusjooned, mis jagavad pintsleid tumedate triipude vahel.
Tüpograafia
12-st 64 pikslini · 8 sammu
- Goga — asendamine: Inter Tight or Space Grotesk · kontuurid 400, 500 · Pealkirja ja alapealkirja font – kasutatakse kõigi H1–H4 pealkirjade ja kaartide puhul. Goga on kohandatud geomeetriline sans-serif font kitsaste avade ja kergelt kandiliste ääristega. Keskmine kaal (500) on reserveeritud kaarditaseme pealkirjade esiletõstmiseks; normaalkaalu (400) kasutatakse põhi- ja jaotiste pealkirjade jaoks. Modali identiteeti määratlevatele alternatiivsetele glüüfikujudele juurdepääsuks peab olema lubatud selle stiilikomplekt „ss01”. Negatiivne tähevahe väheneb järk-järgult -0,007em-lt 48 piksli juures -0,017em-ni 21 piksli juures.
- Inter Variable — asendamine: Inter · kontuurid 400, 500 · Kasutajaliides ja sisutekst – navigeerimine, nupud, sisutekst, sildid, jalus. Interaktiivsete elementide ja navigeerimise puhul kasutatakse vaikimisi keskmist raskust (500); lõikude puhul tavalist raskust (400). Tähevahe väheneb märgatavalt isegi väikeste suuruste korral (-0,026em 14 piksli juures, -0,022em 16 piksli juures), andes liidesele kontsentreeritud ja lõpp-tihedusega ilme. Alternatiivsete kirjavahemärkidena tuleks lisada tähevariant 'cv11'. Suurtähtedega siltide puhul, mille suurus on 12 pikslit, kasutatakse põhiteksti tiheduse tasakaalustamiseks +0,05em tähevahe.
Intervallid ja vorm
| Eesmärk | Tähendus |
|---|---|
| Tihedus | keskmine |
| Põhisamm | 20px |
| Nupu raadius | 12px |
| Kaardi raadius | 8px |
| Varjud | ei - varjude asemel äärised |
| Sektsioonide vahel | 80px |
| Lehe laius | 1280px |
Tehisintellekt loob teie veebisaidi Modal stiilis ja täidab selle
- Täida toodete ja postitustega lingi kaudu - Instagram, TikTok, Facebook.
- Kanna sisu oma vanalt saidilt üle – täpsusta lihtsalt aadress.
- Moodne disain parimal mootoril: React ( Next.js) koos serveri renderdamise ja SEO optimeerimisega koheselt.
- Täisautomaatne SEO optimeerimine otsingutulemuste ja närvivõrgu soovituste jaoks.
Sarnased stiilid
- Slash — Keskööseiklus kullatud pearaamatutega
- AgentQL — Virmalised terminali kohal öösel
- GitHub — Kosmose juhtimispaneel bioluminestsentssete juhtimispunktidega – tume, atmosfääriline tööruum, kus üks roheline kuma näitab teed edasi.
- Doppler — Võlvkambri lilla valgustus keskööl. Peaaegu must lõuend helendab ühe lavendlivärvi signaali ja rohelise kinnitustulega, iga pind on piisavalt kõver, et seda haarata.
- Basedash — Mati kirjastiiliga kesköine andmeterminal. Tume observatoorium, kus mõõdikud helendavad lillalt ja roheliselt, müra kohal hõljuvad serif-kirjas pealkirjad ning valged tabletikujulised nupud on ainsad eredad objektid pehmete mustade pindadega ruumis.
- Superwhisper — Virmalised lahustuvad kesköise klaasi kohal
- Better Stack — Kesköö SRE konsool
- Langbase — Kesköö virmaliste konsool
- Astro — Süvakosmose missiooni juhtimiskeskus ühe lilla kumaga udukogust
- Wayfinder — Must filmiekraan, mille kohal hõljub vaevu kuuldav pealkiri. Liides on pigem heleduse liugur kui juhtpaneel.
- HashiCorp — Lilla neooniga keskööl asuv juhtimisruum on tume tehniline pind, kus ainsa värviviidetena on helendav kuusnurkne kuup.
- Umbrel — Hubane lõkkease öises serveriruumis – pimedas ruumis, kus üksainus virsikukarva kuma rõhutab seda, mis on tõeliselt oluline.