Framer

neon gallery sa kawalan

Ang Framer ay gumagana bilang halos ganap na kadiliman—isang itim na canvas kung saan ang nilalaman ay nakalutang na parang neon sign sa bukana ng gallery. Ang mga headline, na nakalagay sa GT Walsheim Medium na may masikip na pagitan ng linya na 0.8–1.1 at agresibong pagitan ng negatibong letra (-0.04em sa 54px), ay lumilikha ng isang pinaikling, pandekorasyon na typeface na nagpapatuloy sa halip na maayos na nakalagay sa pahina. Ang isang electric blue (#0099ff) ay nagbibigay ng lahat ng functional accent—mga border, glow, mga icon, mga aktibong estado—habang ang natitirang bahagi ng interface ay nananatiling achromatic, umaasa sa mga banayad na gray transition (#111, #171717, #242424) upang lumikha ng lalim mula sa purong itim. Ang mga bahagi ay parang isinasaalang-alang sa halip na pandekorasyon: bilugan na radii na 8–25px, manipis na 1px na mga border, kaunting drop shadow, at mga translucent na ibabaw na nagpapahintulot sa kawalan na sumikat.

Ang mga seksyong may buong lapad ay umaabot nang lampas sa itim na canvas, na may nilalamang limitado sa maximum na lapad na ~1200px at nakasentro sa loob. Ang pangunahing seksyon ay nagtatampok ng header na nakahanay sa kaliwa at isang call-to-action (CTA) button, na ang kanang bahagi ay sadyang iniwang blangko—walang simetriko, hindi nakasentro. Ang mga seksyon ay nagpapalitan sa pagitan ng mga layout na text-only (malaking header + subtext) at mga screenshot ng produkto. Ang seksyong "May Kasamang Framer" ay gumagamit ng isang pader ng logo sa isang grid na may 4 na hanay. Sa seksyon ng komunidad, ang isang screenshot ng produkto ay inilalagay sa loob ng isang nakasentro, full-width na lalagyan na may mga bilugan na sulok. Minimal lang ang nabigasyon—isang manipis na top bar na may logo sa kaliwa at mga link na nakahanay sa kanan, na walang nakikitang mga kontrol. Ritmo ng seksyon: makabuluhang 80px na patayong puwang sa pagitan ng mga seksyon, na lumilikha ng mga natatanging isla ng nilalaman na lumulutang sa kawalan.

Nangingibabaw ang mga screenshot ng user interface ng produkto—naka-frame sa pamamagitan ng isang mala-chrome na window na may mga tuldok sa traffic light, ang mga naka-embed na screenshot ng app ang nagiging pangunahing larawan. Ang mga logo, na nagsisilbing patunay ng kalidad, ay inihaharap sa puting letra sa isang itim na background na may malawak na espasyo. Walang mga litrato, ilustrasyon, o abstract graphics na ginamit—ang visual na wika ay ang produkto mismo, na ipinapakita bilang isang buhay na interface. Estilo ng icon: minimalist, nakabalangkas, monochrome at puti sa maliliit na sukat. Densidad ng teksto: pangunahing teksto, na may paminsan-minsang malalaking fragment sa anyo ng mga screenshot ng produkto. Ang visual na balanse ng espasyo ay malinaw na pinapaboran ang tipograpiya kaysa sa mga imahe.

Madilim Premium Minimalismo Malambot na mga gradient

https://framer.com

Paleta

Tatak

Vivid Violet #0066ff — Ang pangunahing action button ang tanging lugar sa interface kung saan ipinapakita ang isang solidong kulay ng background ng button.

Neutral

Bone #ffffff — Mga pangunahing heading, pangunahing teksto sa madilim na background, button background ang tanging pinagmumulan ng liwanag.
Void #000000 — Ang page canvas, navigation background, mga ibabaw ng card, icon fill—lahat ay walang katapusang itim na kulay na sumisipsip ng lahat ng hindi mahahalagang nilalaman.
Graphite #111111 — Ang mga nakataas na ibabaw ng card ay isang hakbang sa itaas ng void—malalaki at magagamit na card at modal container.
Obsidian #171717 — Intermediate surface para sa mga button, karagdagang card, UI fill - naghihiwalay sa mga interactive na elemento mula sa canvas.
Slate #242424 — Kapag naka-hover, ang mga input field at naka-indent na panel ang siyang pinakamaliwanag na neutral na kulay bago lumipat sa text format.
Ash #333333 — Malalim na pagpuno para sa mga hindi aktibong larawan sa background at mga elementong istruktural.

Tipograpiya

mula 12 hanggang 68px · 8 hakbang

sans-serif — kapalit: Inter · mga balangkas 400 · sans-serif - matatagpuan sa nakuha na datos ngunit hindi inilarawan ng AI.
GT Walsheim — kapalit: Inter Tight · mga balangkas 500 · Ang font para sa mga heading at pamagat ay ang brand font. Ito ay agresibong pinaikli, na may pagitan ng linya na 0.8–1.1 at pagitan ng mga letra na -0.04em hanggang -0.05em sa hanay na 44–68px. Hindi ito isang pandekorasyon na elemento; ang heometrikong init ng GT Walsheim, na sinamahan ng mahigpit na mga sukatan, ay lumilikha ng boses ng sistema—may kumpiyansa, siksik, at bahagyang futuristic. Para sa katulad na heometrikong ekspresyon, isaalang-alang ang Inter Tight o Space Grotesk Bold.
Inter Variable — kapalit: Inter · mga balangkas 400 · Ang pangunahing teksto, nabigasyon, at mga pangalawang heading ang siyang pangunahing gawain. Ang Inter Variable axis ay nagbibigay-daan para sa maayos na interpolasyon ng mga timbang. Ang pagsubaybay ay lumiliit habang tumataas ang laki: mula -0.001em hanggang 18px at hanggang -0.027em hanggang 22px. Ang variable na bersyon ay nagbibigay-daan para sa maayos na mga micro-animation ng site. Kapalit: Inter ( Google) – isang halos magkaparehong fallback.

Mga pagitan at anyo

Layunin	Kahulugan
Densidad	karaniwan
Pangunahing hakbang	10px
Radius ng buton	9999px
Radius ng card	20px
Mga anino	walang - mga hangganan sa halip na mga anino
Sa pagitan ng mga seksyon	80px
Lapad ng pahina	1200px

Gagawa ang AI ng website mo sa estilong Framer at pupunuin ito

Punuin ng mga produkto at post gamit ang link - Instagram, TikTok, Facebook.
Maglipat ng nilalaman mula sa iyong lumang site—tukuyin lamang ang address.
Modernong disenyo gamit ang pinakamahusay na engine: React ( Next.js) na may kasamang server rendering at SEO optimization na agad-agad.
Ganap na awtomatikong pag-optimize ng SEO para sa mga resulta ng paghahanap at mga rekomendasyon sa neural network.

Gumawa ng website sa ganitong istilo

Mga katulad na estilo

Auros — Abyssal terminal na may mga bioluminescent data ball
Origin Financial — Isang hatinggabi na galeriya ng tahimik na karangyaan. Isang tahimik, halos madilim na silid kung saan ang malalaking serif font at ilang maliwanag na kulay na mga panel ay lumilikha ng pakiramdam na ang pananalapi ay isang maingat na inayos na likhang sining.
Raycast — Sentro ng Pamumuno sa Hatinggabi, Coral Neon
Dimension — isang workstation na naliliwanagan ng takipsilim na may mga panel na may frosted glass
Reflect Notes — Ang mabituing lilang kalawakan ay isang madilim na obserbatoryo kung saan ang mga nota ay lumulutang na parang mga konstelasyon laban sa likuran ng halos itim na kawalan ng indigo.
Ameba — Ang control room sa hatinggabi – isang electric blue pulse sa loob ng mga frosted glass panel
Branding — Itim na pader ng gallery, mga pulang-pulang accent - Malalaking puting font ang lumulutang sa isang madilim na canvas na parang isang kawalan, na naputol ng isang matingkad na pulang accent at mga kapansin-pansing pandekorasyon na elemento na mas mukhang signage ng gallery kaysa sa isang web interface.
Harness — Mission Control sa hatinggabi na may mga accent na berde na may phosphorescent
Koto — Ang Obsidian Gallery sa hatinggabi. Isang halos madilim na entablado, kung saan ang tanging mainit na pinagmumulan ng liwanag ay isang dilaw na marker, at ang kondensada ay lumulutang sa malawak na negatibong espasyo na parang mga poster ng eksibisyon.
Ohzi — Isang kumikinang na kubo na nakasabit sa isang madilim na gallery
Depot — Isang madilim na server terminal. Isang halos itim na developer console, na may isang berdeng LED na hudyat ng pagsisimula ng trabaho, at ang natitirang bahagi ng user interface ay ipinapakita sa graphite.
Maciej Zadykowicz — Ang Midnight Gallery, kasama ang kaleidoscopic mural nito, ay isang halos itim na dingding sa studio kung saan ang isang matingkad at makulay na tipograpiyang piraso ng sining ay nakakakuha ng atensyon habang ang lahat ng iba pa ay nananatiling tahimik at maingat.