Framer
galeria de neó al buit
Framer opera com una foscor gairebé total: un llenç negre on el contingut plana com un rètol de neó en una inauguració de galeria. Els titulars, amb el color GT Walsheim Medium i un espaiat entre línies ajustat de 0,8 a 1,1 i un espaiat negatiu agressiu entre lletres (-0,04 em a 54 px), creen una tipografia condensada i decorativa que avança en lloc de quedar-se ben fixada a la pàgina. Un únic blau elèctric (#0099ff) proporciona tots els accents funcionals (vores, brillantor, icones, estats actius), mentre que la resta de la interfície roman acromàtica, basant-se en subtils transicions grises (#111, #171717, #242424) per crear profunditat a partir del negre pur. Els components semblen considerats en lloc de decoratius: radis arrodonits de 8 a 25 px, vores primes d'1 px, ombres paral·leles mínimes i superfícies translúcides que permeten que el buit brilli.
Les seccions d'amplada completa s'estenen més enllà del llenç negre, amb contingut limitat a una amplada màxima d'uns 1200 px i centrat a l'interior. La secció principal presenta una capçalera alineada a l'esquerra i un únic botó de crida a l'acció (CTA), amb el costat dret deixat intencionadament en blanc, de manera asimètrica, no centrat. Les seccions alternen entre dissenys de només text (capçalera gran + subtext) i captures de pantalla del producte. La secció "Ve amb un marc" utilitza un mur de logotips en una quadrícula de 4 columnes. A la secció de la comunitat, una captura de pantalla del producte es col·loca dins d'un contenidor centrat d'amplada completa amb cantonades arrodonides. La navegació és mínima: una barra superior fina amb el logotip a l'esquerra i els enllaços alineats a la dreta, sense controls visibles. Ritme de la secció: espais verticals significatius de 80 px entre les seccions, creant illes de contingut diferents que suren al buit.
Predominen les captures de pantalla de la interfície d'usuari del producte: emmarcades per una finestra semblant a la de crom amb punts de semàfor, les captures de pantalla incrustades de l'aplicació es converteixen en la imatge principal. Els logotips, que serveixen com a prova de qualitat, es presenten amb lletres blanques sobre un fons negre amb un espaiat ampli. No s'utilitzen fotografies, il·lustracions ni gràfics abstractes: el llenguatge visual és el producte en si, mostrat com una interfície viva. Estil d'icones: minimalista, contornejat, monocrom i blanc en mides petites. Densitat del text: predominantment text, amb fragments grans ocasionals en forma de captures de pantalla del producte. L'equilibri visual de l'espai afavoreix clarament la tipografia per sobre de les imatges.
Paleta
Marca
- Vivid Violet
#0066ff— El botó d'acció principal és l'únic lloc de la interfície on es mostra un fons de botó de color sòlid.
Neutral
- Bone
#ffffff— Encapçalaments principals, text principal sobre un fons fosc, el fons dels botons és l'única font de llum. - Void
#000000— El llenç de la pàgina, el fons de navegació, les superfícies de les targetes i l'emplenament de les icones: tot és d'un color negre infinit que absorbeix tot el contingut no essencial. - Graphite
#111111— Les superfícies de cartes en relleu estan un esglaó per sobre del buit: grans cartes funcionals i contenidors modals. - Obsidian
#171717— Superfície intermèdia per a botons, targetes addicionals i farciments d'IU: separa els elements interactius del llenç. - Slate
#242424— En passar el cursor per sobre, els camps d'entrada i els panells amb sagnat tenen el to neutre més brillant abans de canviar al format de text. - Ash
#333333— Emplenament profund per a imatges de fons inactives i elements estructurals.
Tipografia
de 12 a 68 px · 8 passos
- sans-serif — reemplaçament: Inter · esquemes 400 · sans-serif: es troba a les dades extretes però no descrit per la IA.
- GT Walsheim — reemplaçament: Inter Tight · esquemes 500 · La font per a encapçalaments i títols és la font de la marca. És agressivament condensada, amb un interlineat de 0,8–1,1 i un interlineat de -0,04em a -0,05em en el rang de 44–68 px. No és un element decoratiu; la calidesa geomètrica de GT Walsheim, combinada amb mètriques estrictes, crea la veu del sistema: segura, compacta i lleugerament futurista. Per a una expressió geomètrica similar, considereu Inter Tight o Space Grotesk Bold.
- Inter Variable — reemplaçament: Inter · esquemes 400 · El text principal, la navegació i els encapçalaments secundaris són la peça clau. L'eix Inter Variable permet una interpolació suau dels pesos. El seguiment es redueix a mesura que augmenta la mida: de -0,001em a 18px i de -0,027em a 22px. La versió variable permet microanimacions suaus del lloc. Substitució: Inter ( Google), una alternativa pràcticament idèntica.
Intervals i forma
| Propòsit | Significat |
|---|---|
| Densitat | mitjana |
| Pas bàsic | 10px |
| Radi del botó | 9999px |
| Radi de la targeta | 20px |
| Ombres | sense vores en comptes d'ombres |
| Entre seccions | 80px |
| Amplada de la pàgina | 1200px |
La IA crearà el vostre lloc web a l'estil Framer 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
- Auros — Terminal abissal amb boles de dades bioluminescents
- Origin Financial — Una galeria de mitjanit d'opulència silenciosa. Una sala silenciosa, gairebé fosca, on grans fonts serif i uns quants panells de colors il·luminats creen la sensació que les finances són una obra d'art acuradament seleccionada.
- Raycast — Centre de Comandament de Mitjanit, Coral Neon
- Dimension — una estació de treball il·luminada al capvespre amb panells de vidre esmerilat
- Reflect Notes — L'espai estrellat violeta és un observatori fosc on les notes suren com constel·lacions sobre un fons de buit gairebé negre indi.
- Ameba — La sala de control a mitjanit: un pols blau elèctric dins dels panells de vidre glaçat
- Branding — Mur de galeria negre, detalls vermell sang: grans fonts blanques suren sobre un llenç fosc que sembla un buit, interromput per un únic detall vermell brillant i elements decoratius cridaners que semblen més una senyalització de galeria que una interfície web.
- Harness — Control de Missió a mitjanit amb detalls verds fosforescents
- Koto — La Galeria d'Obsidiana a mitjanit. Un escenari gairebé a les fosques, on l'única font de llum càlida és un marcador groc, i la lletra condensada sura en el vast espai negatiu com els pòsters d'una exposició.
- Ohzi — Un cub brillant suspès en una galeria fosca
- Depot — Un terminal de servidor fosc. Una consola de desenvolupador gairebé negra, amb un únic LED verd que indica l'inici del treball, i la resta de la interfície d'usuari mostrada en grafit.
- Maciej Zadykowicz — La Midnight Gallery, amb el seu mural calidoscòpic, és una paret d'estudi gairebé negra on una peça d'art tipogràfica vibrant i colorida crida l'atenció mentre que tota la resta roman tranquil·la i deliberada.