Modal
Un terminal fosforescent en una sala de servidors fosca: l'única font de llum és un color verd brillant.
El modal funciona com un terminal fosforescent en una sala de servidors fosca: un llenç gairebé negre, tipus verd pàl·lid i un únic accent verd llima brillant que actua com a indicador d'estat LED. El llenguatge de disseny està centrat en el desenvolupador: finestres de codi monoespaiades amb punts de semàfor, icones 3D isomètriques en el verd característic i molt d'espai en blanc, permetent que un element de cada secció brilli. La tipografia es divideix entre una font personalitzada (Goga) per als encapçalaments i una font variable (Inter) per a tots els elements de la interfície d'usuari, ambdues configurades amb un seguiment negatiu estret. Els colors es distribueixen uniformement: la majoria de les pantalles són acromàtiques i el color verd llima brillant només apareix a les accions clau, el logotip, les il·lustracions 3D i els moments d'èmfasi. Els components són plans i sense marc, amb profunditat creada a través de vores verdes subtils i desenfocament de fons en lloc d'ombres.
El modal utilitza un disseny fosc d'amplada completa amb una amplada màxima de 1280 px per allotjar el contingut. La finestra principal està centrada: el títol (la primera frase en verd llima), un subtítol, dues crides a l'acció i un únic objecte 3D com a àncora visual, sense separar el disseny de la barra lateral. Les seccions de contingut segueixen un ritme uniforme: etiqueta de cella (majúscules, Moss 70) → títol Goga → text del cos apagat, i després un disseny de dues columnes amb una descripció de la característica (text + codi/targeta visual) o una quadrícula de targetes de tres columnes. Els marges entre seccions són generosos: 80 px. La pàgina alterna entre franges buides profundes (#000000) i franges de fons lleugerament més clares (#181818), amb una secció clara (#def0dd) que apareix al mig de la pàgina com a respir visual. La navegació consisteix en una única barra superior fixa amb un fons borrós, sense barra lateral ni megamenú. El peu de pàgina és compacte i fosc, amb columnes d'enllaços verdes apagades. La densitat del text és còmoda: cada secció té un espai ampli i les quadrícules de targetes no utilitzen més de tres columnes.
El llenguatge visual de Modal es divideix en dos modes: renders de productes brillants en 3D i maquetes de finestres de codi fosc. El punt focal és un únic cub 3D renderitzat amb un degradat de màrqueting (de verd llima a maragda), situat dins d'un halo de degradat radial que banya l'espai buit amb llum verda, l'estil visual característic de la marca. Les targetes de càrrega de treball contenen icones 3D isomètriques (un cub de filferro, una escala sòlida, capes) renderitzades en el mateix verd llima sobre un fons fosc. Els resultats del codi i dels punts de referència es presenten com a targetes de finestra de terminal amb punts de semàfor, ressaltat de sintaxi monoespaiat en una paleta fosforescent i una vora verda apagada; semblen captures de pantalla d'una interfície de línia d'ordres real. Els logotips dels clients es mostren com a etiquetes desaturades de color verd-gris en una sola fila de baix contrast, cosa que indica confiança sense competència visual. La densitat general és baixa: la majoria de les pàgines contenen predominantment text i les imatges es presenten com a punts focals individuals en lloc de quadrícules de fotografies. No hi ha fotografies; tot el sistema visual es renderitza, és geomètric i radiant.
Paleta
Marca
- Lime Pulse
#7fee64— Els elements principals de la identitat corporativa són el logotip, la crida a l'acció principal (CTA), l'ompliment d'etiquetes, els estats actius i el color bàsic de la il·lustració.
Neutral
- Phosphor White
#ddffdc— El text principal, el color del títol, el contorn de la icona i el text del botó omplert són la superfície llegible principal. - Void Black
#000000— Lienç de la pàgina, la capa de fons més profunda - Ground Iron
#181818— Emplenament del botó principal, superfícies de la targeta a les zones fosques, superfície base de la interfície d'usuari. - Carbon Veil
#212525— Superfícies elevades, fons de navegació, lleugerament més lleugeres que el terra. - Circuit Border
#485346— El marc d'acció del contorn/fantasma, la principal línia fina interactiva, és d'un to gris verdós apagat. - Phosphor Blue-Black
#1f2a33— Línies de marcatge primes secundàries, que divideixen els traços entre franges fosques.
Tipografia
de 12 a 64 px · 8 passos
- Goga — reemplaçament: Inter Tight or Space Grotesk · esquemes 400, 500 · Font d'encapçalament i subencapçalament: s'utilitza per a tots els encapçalaments i targetes H1–H4. Goga és una font sans-serif geomètrica personalitzada amb obertures estretes i terminals lleugerament quadrats. El pes mitjà (500) es reserva per ressaltar els encapçalaments a nivell de targeta; el pes normal (400) s'utilitza per als encapçalaments de secció i d'heroi. Per accedir a les formes de glif alternatives que defineixen la identitat de Modal, cal activar el seu conjunt estilístic 'ss01'. L'espaiat negatiu entre lletres disminueix gradualment de -0,007em a 48px a -0,017em a 21px.
- Inter Variable — reemplaçament: Inter · esquemes 400, 500 · Interfície d'usuari i text del cos: navegació, botons, text del cos, etiquetes, peu de pàgina. Per defecte, s'utilitza el pes mitjà (500) per als elements interactius i la navegació; el normal (400) s'utilitza per als paràgrafs. L'espaiat entre lletres es redueix notablement fins i tot en mides petites (-0,026 em a 14 px, -0,022 em a 16 px), cosa que dóna a la interfície una densitat terminal condensada. Per a la puntuació alternativa, s'hauria d'incloure la variant de caràcter 'cv11'. Les etiquetes en majúscules a 12 px utilitzen un espaiat entre lletres de +0,05 em per contrarestar la densitat del text del cos.
Intervals i forma
| Propòsit | Significat |
|---|---|
| Densitat | mitjana |
| Pas bàsic | 20px |
| Radi del botó | 12px |
| Radi de la targeta | 8px |
| Ombres | sense vores en comptes d'ombres |
| Entre seccions | 80px |
| Amplada de la pàgina | 1280px |
La IA crearà el vostre lloc web a l'estil Modal i l'omplirà.
- Omple amb productes i publicacions a través de l'enllaç: Instagram, TikTok, Facebook.
- Transfereix contingut del teu lloc web antic; només cal que especifiquis l'adreça.
- Disseny modern en el millor motor: React ( Next.js) amb renderització de servidor i optimització SEO des del primer moment.
- Optimització SEO totalment automatitzada per a resultats de cerca i recomanacions de xarxes neuronals.
Estils similars
- Slash — Volta de mitjanit amb llibres majors daurats
- AgentQL — Aurores boreals sobre la terminal a la nit
- GitHub — Un panell de comandament espacial amb punts de control bioluminescents: un espai de treball fosc i atmosfèric on una única resplendor verda indica el camí a seguir.
- Doppler — La il·luminació porpra de la volta a mitjanit. El llenç gairebé negre brilla amb un únic senyal lavanda i una llum verda de confirmació, totes les superfícies prou corbades per ser agafades.
- Basedash — Un terminal de dades de mitjanit amb font mat. Un observatori fosc on les mètriques brillen de color porpra i verd, els titulars amb serifes suren per sobre del soroll i els botons blancs amb forma de píndola són els únics objectes brillants en una habitació de superfícies negres suaus.
- Superwhisper — Les aurores boreals es dissolen sobre el vidre de mitjanit
- Better Stack — Consola SRE de mitjanit
- Langbase — Consola Midnight Northern Lights
- Astro — Control de la Missió Espacial Profund amb una única resplendor porpra d'una nebulosa
- Wayfinder — Una pantalla de cinema negra amb un títol gairebé inaudible que sura sobre una il·lustració en directe. La interfície és un control lliscant de brillantor en lloc d'un panell de control.
- HashiCorp — La sala de control a mitjanit amb neó morat és una superfície tècnica fosca on un cub hexagonal brillant serveix com a única referència de color.
- Umbrel — Una foguera acollidora a la sala de servidors nocturna: una habitació fosca on una única resplendor de color préssec destaca allò que és realment important.