Modal
En fosforescerende terminal i et mørklagt serverrom – den eneste lyskilden er en lys grønn farge
Modal fungerer som en fosforescerende terminal i et mørklagt serverrom: et nesten svart lerret, blekgrønn skrift og en enkelt lys limegrønn aksent som fungerer som en LED-statusindikator. Designspråket er utviklerfokusert – monospaced-kodevinduer med trafikklysprikker, isometriske 3D-ikoner i den signaturgrønne fargen og rikelig med hvit plass, slik at ett element i hver seksjon kan lyse. Typografien er delt mellom en tilpasset skrifttype (Goga) for overskrifter og en variabel skrifttype (Inter) for alle UI-elementer, begge satt med smal negativ sporing. Fargene er jevnt fordelt: de fleste skjermer er akromatiske, og den lyse limegrønne fargen vises bare på viktige handlinger, logoen, 3D-illustrasjoner og øyeblikk med vekt. Komponentene er flate og rammeløse, med dybde skapt gjennom subtile grønne rammer og bakgrunnsuskarphet i stedet for skygger.
Modalvinduet bruker en mørk layout i full bredde med en maksimal bredde på 1280 piksler for å få plass til innholdet. Hovedvinduet er sentrert: tittelen (den første setningen i limegrønn), en underoverskrift, to handlingsfremmende oppfordringer og et enkelt 3D-objekt som et visuelt anker – uten å skille layouten fra sidefeltet. Innholdsseksjonene følger en ensartet rytme: øyenbrynstag (store bokstaver, Moss 70) → Goga-tittel → dempet brødtekst, deretter enten en layout med to kolonner med en funksjonsbeskrivelse (tekst + kode/visuelt kort) eller et rutenett med tre kolonner med kort. Innfellingene mellom seksjonene er generøse – 80 piksler. Siden veksler mellom dype, tomme (#000000) og litt lysere bakgrunnsstriper (#181818), med én lys seksjon (#def0dd) som vises midt på siden som et visuelt pust. Navigasjonen består av en enkelt, fast topplinje med en uskarp bakgrunn – ingen sidefelt eller megameny. Bunnteksten er kompakt og mørk, med dempede grønne lenkekolonner. Teksttettheten er komfortabel: hver seksjon har god plass, og kortrutenett bruker ikke mer enn tre kolonner.
Modals visuelle språk er delt inn i to moduser: glødende 3D-produktgjengivelser og mørke kodevindumodeller. Fokuspunktet er en enkelt 3D-kube gjengitt med en markedsføringsgradient (fra limegrønn til smaragdgrønn), plassert i en radial gradientglorie som bader det tomme rommet i grønt lys – merkets signaturvisuelle stil. Arbeidsbelastningskort inneholder isometriske 3D-ikoner (en wireframe-kube, en heldekkende trapp, lag) gjengitt i samme limegrønne farge mot en mørk bakgrunn. Kode- og referanseresultater presenteres som terminalvinduskort med trafikklysprikker, monospaced syntaksutheving i en fosforescerende palett og en dempet grønn kant – de ligner skjermbilder av et ekte kommandolinjegrensesnitt. Klientlogoer vises som desaturerte grønngrå etiketter i en enkelt rad med lav kontrast, noe som signaliserer tillit uten visuell konkurranse. Den totale tettheten er lav – de fleste sider inneholder hovedsakelig tekst, og bilder presenteres som individuelle fokuspunkter i stedet for rutenett av fotografier. Det er ingen fotografier; hele det visuelle systemet er gjengitt, geometrisk og strålende.
Palett
Merke
- Lime Pulse
#7fee64— Hovedelementene i bedriftsidentiteten er logoen, den viktigste handlingsfremmende oppfordringen (CTA), tagutfylling, aktive tilstander og illustrasjonens grunnfarge.
Nøytral
- Phosphor White
#ddffdc— Hovedteksten, tittelfargen, ikonomrisset og den fylte knappeteksten er den viktigste lesbare overflaten. - Void Black
#000000— Sidelerret, det dypeste bakgrunnslaget - Ground Iron
#181818— Hovedknappfylling, kortflater i mørke områder, brukergrensesnittets basisflate. - Carbon Veil
#212525— Forhøyede overflater, navigasjonsbakgrunn, litt lysere enn bakken. - Circuit Border
#485346— Omriss-/spøkelsesaksjonsrammen, den viktigste interaktive tynne linjen, har en dempet grønngrå nyanse. - Phosphor Blue-Black
#1f2a33— Sekundære tynne markeringslinjer som deler streker mellom mørke striper.
Typografi
fra 12 til 64 piksler · 8 trinn
- Goga — erstatning: Inter Tight or Space Grotesk · omriss 400, 500 · Overskrifts- og underoverskriftsskrifttype – Brukes for alle H1–H4-overskrifter og -kort. Goga er en tilpasset geometrisk sans-serif-skrifttype med smale åpninger og litt firkantede terminaler. Medium vekt (500) er reservert for å fremheve overskrifter på kortnivå; normal vekt (400) brukes for hoved- og seksjonsoverskrifter. For å få tilgang til de alternative tegnformene som definerer Modals identitet, må stilsettet 'ss01' være aktivert. Negativ bokstavavstand reduseres gradvis fra -0,007 em ved 48 piksler til -0,017 em ved 21 piksler.
- Inter Variable — erstatning: Inter · omriss 400, 500 · Brukergrensesnitt og brødtekst – navigasjon, knapper, brødtekst, etiketter, bunntekst. Medium vekt (500) brukes som standard for interaktive elementer og navigasjon; normal (400) brukes for avsnitt. Bokstavavstanden reduseres merkbart selv ved små størrelser (-0,026 em ved 14 piksler, -0,022 em ved 16 piksler), noe som gir grensesnittet en kondensert, terminal tetthet. For alternativ tegnsetting bør tegnvarianten 'cv11' inkluderes. Etiketter med store bokstaver ved 12 piksler bruker +0,05 em bokstavavstand for å motvirke brødteksttettheten.
Intervaller og form
| Hensikt | Betydning |
|---|---|
| Tetthet | gjennomsnittlig |
| Grunnleggende trinn | 20px |
| Knapperadius | 12px |
| Kortradius | 8px |
| Skygger | ingen grenser i stedet for skygger |
| Mellom seksjoner | 80px |
| Sidebredde | 1280px |
AI vil bygge nettstedet ditt i Modal -stil og fylle det
- Fyll på med produkter og innlegg via lenken - Instagram, TikTok, Facebook.
- Overfør innhold fra det gamle nettstedet ditt – bare oppgi adressen.
- Moderne design på den beste søkemotoren: React ( Next.js) med serverrendering og SEO-optimalisering rett ut av boksen.
- Helautomatisk SEO-optimalisering for søkeresultater og anbefalinger fra nevrale nettverk.
Lignende stiler
- Slash — Midnattshvelv med forgylte bøker
- AgentQL — Nordlys over terminalen om natten
- GitHub — Et romkommandopanel med bioluminescerende kontrollpunkter – et mørkt, atmosfærisk arbeidsområde der en enkelt grønn glød peker veien fremover.
- Doppler — Hvelvets lilla lys ved midnatt. Det nesten svarte lerretet gløder med et enkelt lavendelfarget signal og et grønt bekreftelseslys, hver overflate er buet nok til å kunne gripes.
- Basedash — En dataterminal ved midnatt med matt skrift. Et mørkt observatorium der målinger lyser lilla og grønt, serif-overskrifter svever over støyen, og hvite pilleformede knapper er de eneste lyse objektene i et rom med myke, svarte overflater.
- Superwhisper — Nordlyset oppløses over midnattsglasset
- Better Stack — Midnatts SRE-konsoll
- Langbase — Midnattsnordlys-konsoll
- Astro — Deep Space Mission Control med en enkelt lilla glød fra en tåke
- Wayfinder — En svart filmskjerm med en knapt hørbar tittel som svever over en levende illustrasjon. Grensesnittet er en lysstyrkeglidebryter i stedet for et kontrollpanel.
- HashiCorp — Kontrollrommet ved midnatt med lilla neon er en mørk teknisk overflate der en glødende sekskantet kube fungerer som eneste fargereferanse.
- Umbrel — En koselig bålplass i nattserverrommet – et mørkt rom hvor en enkelt ferskenglød fremhever det som virkelig er viktig.