
Modal
En fosforescerende terminal i et mørklagt serverrum - den eneste lyskilde er en lys grøn farve
Modal fungerer som en fosforescerende terminal i et mørklagt serverrum: et næsten sort lærred, lysegrøn skrift og en enkelt lys limegrøn accent, der fungerer som en LED-statusindikator. Designsproget er udviklerfokuseret – monospacede kodevinduer med trafiklysprikker, isometriske 3D-ikoner i den karakteristiske grønne farve og masser af hvid plads, der tillader ét element i hver sektion at lyse. Typografien er opdelt i en brugerdefineret skrifttype (Goga) til overskrifter og en variabel skrifttype (Inter) til alle UI-elementer, begge indstillet med smal negativ tracking. Farverne er jævnt fordelt: de fleste skærme er akromatiske, og den klare limegrønne farve vises kun på nøglehandlinger, logoet, 3D-illustrationer og øjeblikke med fremhævelse. Komponenterne er flade og rammeløse, med dybde skabt gennem subtile grønne kanter og baggrundssløring snarere end skygger.
Modalvinduet bruger et mørkt layout i fuld bredde med en maksimal bredde på 1280px for at rumme indholdet. Hovedvinduet er centreret: titlen (den første sætning i limegrøn), en underoverskrift, to opfordringer til handling og et enkelt 3D-objekt som visuelt anker – uden at adskille layoutet fra sidebjælken. Indholdssektionerne følger en ensartet rytme: øjenbrynstag (store bogstaver, Moss 70) → Goga-titel → dæmpet brødtekst, derefter enten et layout med to kolonner med en funktionsbeskrivelse (tekst + kode/visuelt kort) eller et gitter med tre kolonner af kort. Indbindingsmargerne mellem sektionerne er generøse – 80px. Siden skifter mellem dybe, tomme (#000000) og lidt lysere baggrundsstriber (#181818), hvor en lys sektion (#def0dd) vises midt på siden som et visuelt pusterum. Navigationen består af en enkelt, fast topbjælke med en sløret baggrund – ingen sidebjælke eller megamenu. Sidefoden er kompakt og mørk med dæmpede grønne linkkolonner. Teksttætheden er behagelig: hver sektion har rigelig plads, og kortgitre bruger højst tre kolonner.
Modals visuelle sprog er opdelt i to tilstande: 3D-glødende produktgengivelser og mørke kodevinduemodeller. Omdrejningspunktet er en enkelt 3D-kube gengivet ved hjælp af en marketinggradient (fra limegrøn til smaragdgrøn), placeret inden for en radial gradienthalo, der bader det tomme rum i grønt lys - brandets signatur visuelle stil. Arbejdsbelastningskort indeholder isometriske 3D-ikoner (en wireframe-kube, en solid trappe, lag) gengivet i den samme limegrønne farve mod en mørk baggrund. Kode- og benchmarkresultater præsenteres som terminalvindueskort med trafiklysprikker, monospaced syntaksfremhævning i en fosforescerende palet og en dæmpet grøn kant - de ligner skærmbilleder af en rigtig kommandolinjegrænseflade. Klientlogoer vises som desaturerede grøngrå etiketter i en enkelt række med lav kontrast, hvilket signalerer tillid uden visuel konkurrence. Den samlede tæthed er lav - de fleste sider indeholder overvejende tekst, og billeder præsenteres som individuelle fokuspunkter snarere end gitre af fotografier. Der er ingen fotografier; hele det visuelle system gengives, geometrisk og strålende.
Palet
Mærke
- Lime Pulse
#7fee64— Hovedelementerne i virksomhedsidentiteten er logoet, den primære opfordring til handling (CTA), tagudfyldning, aktive tilstande og illustrationens grundfarve.
Neutral
- Phosphor White
#ddffdc— Hovedteksten, titelfarven, ikonomridset og den udfyldte knaptekst er den primære læsbare overflade. - Void Black
#000000— Sidelærred, det dybeste baggrundslag - Ground Iron
#181818— Udfyldning af hovedknapper, kortoverflader i mørke områder, brugergrænsefladens bundflade. - Carbon Veil
#212525— Hævede overflader, navigationsbaggrund, lidt lysere end jorden. - Circuit Border
#485346— Kontur-/spøgelsesactionrammen, den primære interaktive tynde linje, har en dæmpet grønlig-grå nuance. - Phosphor Blue-Black
#1f2a33— Sekundære tynde markeringslinjer, der deler streger mellem mørke striber.
Typografi
fra 12 til 64px · 8 trin
- Goga — udskiftning: Inter Tight or Space Grotesk · konturer 400, 500 · Overskrifts- og underoverskriftsskrifttype – Bruges til alle H1-H4 overskrifter og kort. Goga er en brugerdefineret geometrisk sans-serif-skrifttype med smalle blænder og let firkantede terminaler. Mellemvægten (500) er reserveret til at fremhæve overskrifter på kortniveau; normalvægten (400) bruges til hoved- og sektionsoverskrifter. For at få adgang til de alternative glyfformer, der definerer Modals identitet, skal dens stilistiske sæt 'ss01' være aktiveret. Negativ bogstavafstand falder gradvist fra -0,007em ved 48px til -0,017em ved 21px.
- Inter Variable — udskiftning: Inter · konturer 400, 500 · Brugergrænseflade og brødtekst – navigation, knapper, brødtekst, etiketter, sidefod. Mellemvægt (500) bruges som standard til interaktive elementer og navigation; normal (400) bruges til afsnit. Bogstavafstanden reduceres mærkbart, selv ved små størrelser (-0,026 em ved 14px, -0,022 em ved 16px), hvilket giver grænsefladen en komprimeret, terminal tæthed. For alternativ tegnsætning bør tegnvarianten 'cv11' inkluderes. Etiketter med store bogstaver ved 12px bruger +0,05 em bogstavafstand for at modvirke brødtekstens tæthed.
Intervaller og form
| Formål | Mening |
|---|---|
| Tæthed | gennemsnit |
| Grundlæggende trin | 20px |
| Knapradius | 12px |
| Kortradius | 8px |
| Skygger | ingen grænser i stedet for skygger |
| Mellem sektioner | 80px |
| Sidebredde | 1280px |
AI vil bygge din hjemmeside i Modal -stil og udfylde den
- Fyld med produkter og opslag via linket - Instagram, TikTok, Facebook.
- Overfør indhold fra dit gamle websted – angiv blot adressen.
- Moderne design på den bedste søgemotor: React ( Next.js) med serverrendering og SEO-optimering lige fra starten.
- Fuldautomatiseret SEO-optimering til søgeresultater og anbefalinger til neurale netværk.
Lignende stilarter
- Slash — Midnatshvælving med forgyldte bøger
- AgentQL — Nordlys over terminalen om natten
- GitHub — Et rumkommandopanel med bioluminescerende kontrolpunkter – et mørkt, atmosfærisk arbejdsområde, hvor en enkelt grøn glød peger vejen frem.
- Doppler — Hvælvingens lilla lys ved midnat. Det næsten sorte lærred gløder med et enkelt lavendelfarvet signal og et grønt bekræftelseslys, hver overflade er buet nok til at blive greben.
- Basedash — En midnatsdataterminal med mat skrifttype. Et mørkt observatorium, hvor målinger lyser lilla og grønt, serif-overskrifter svæver over støjen, og hvide pilleformede knapper er de eneste lyse objekter i et rum med bløde, sorte overflader.
- Superwhisper — Nordlyset opløses over midnatsglasset
- Better Stack — Midnight SRE-konsol
- Langbase — Midnatsnordlys-konsol
- Astro — Deep Space Mission Control med en enkelt lilla glød fra en tåge
- Wayfinder — En sort filmskærm med en næsten uhørbar titel, der svæver over en liveillustration. Brugerfladen er en lysstyrkeskyder snarere end et kontrolpanel.
- HashiCorp — Kontrolrummet ved midnat med lilla neon er en mørk teknisk overflade, hvor en lysende sekskantet kube fungerer som den eneste farvereference.
- Umbrel — En hyggelig bålplads i natserverrummet – et mørkt rum, hvor en enkelt ferskenfarvet glød fremhæver, hvad der virkelig er vigtigt.