Authkit
Matt üveg katedrális éjfélkor
Az AuthKit egy éjszakai termékbemutató esztétikát teremt: egy majdnem fekete vászon matt üvegfelületekkel, alig látható vonalakból álló ráccsal és világító szöveggel, amelyet egy üvegréteg világít meg. A betűtípus szinte teljes egészében fehér sötét háttér előtt, egyetlen élénk lila díszítéssel – minden interaktív felületen egy lágy, vékony, hűvös kékesfehér vonal található, nem pedig merev keret. Az összetevők áttetsző rétegeken helyezkednek el, egy környezeti fény fölé rétegezve, és a kártyák alulról megvilágított üveglapokként jelennek meg, nem pedig papírpanelekként. A térközök nagyok és ritmikusak; a fő elem egyetlen megvilágított logó, amely az oldal teljes szélességében átfogja, lebegő üvegkártyákkal körülvéve, a hagyományos osztott képernyős elrendezés helyett.
Teljes szélességű, sötét vászon középre igazított tartalomtárolóval, maximum 1200 képpont széles. A fő elem egyetlen, középre igazított, megvilágított logó ("AuthKit" színátmenetes betűtípussal) egy kis, szemöldök alakú szöveg alatt, amely mögött/alatt három lebegő üvegkártya helyezkedik el egy bejelentkezési űrlappal (bal oldali kártya balra döntve, középső kártya maximalizálva, jobb oldali kártya jobbra döntve). A fő elem alatt középre igazított világos/sötét témaváltó található. A funkciósor egy 6 ikonból álló vízszintes idővonal, vékony összekötő vonalakkal a kör alakú ikonok között. Szekcióritmus: minden szakasz egy középre igazított, szemöldök alakú szöveggel kezdődik, amelyet elhalványuló vízszintes vonalak kereteznek, majd egy nagy, középre igazított cím (44-48 képpont), majd egyetlen sornyi tompa szöveg (16-18 képpont), maximum szélesség ~640 képpont. A Testreszabás szakasz egy böngészőablak makettjét jeleníti meg, amelyben egy középen elhelyezkedő bejelentkezési kártya található, amelyet lebegő felhasználói felület ellenőrző panelek (színpaletták, sugárcsúszkák, logó ikonválasztó, gomb szövegmező, oldal háttér mező) vesznek körül, a vászon sarkaiban elhelyezve, mint egy tervezőeszközök munkaterületén.
A vizuális dizájnt a bejelentkezési űrlapok makettjei uralják, amelyeket „üvegmorfológia” stílusban készítettek (e-mail/jelszó beviteli mezők, közösségi média bejelentkezési gombok, jelszó nélküli kódbevitel), és lebegő, áttetsző kártyákként jelennek meg egy éjféli vászon előtt. A funkcióikonok monokróm lineáris karakterjelek #d1e4fa betűtípussal, kerek, matt csempékben. Egy finom rács (1 képpontos vonalak rgba(186,215,247,0.06) színmélységben) borítja az egész oldalt, hangulatot teremtve, míg egy kúpos gradiens reflektorfény csillog a fő elem tetején. Nincsenek fotók, nincsenek életstílus képek, nincsenek termékről készült képernyőképek – maga a termék a vizuális elem: bejelentkezési mezők, amelyek üvegprototípusokhoz hasonlóan vannak elrendezve egy sötét stúdióban.
Paletta
Márka
- Void Violet
#663af3— A cselekvésre ösztönző (CTA) gomb elsődleges színe az egyetlen hangsúlyszín, amelyet kizárólag a bejelentkezési űrlapokon belüli „Folytatás/Küldés” gombhoz használnak; az élénk lila a közel fekete háttér előtt sürgősség érzetét kelti anélkül, hogy megzavarná a monokróm színsémát.
Semleges
- Midnight Canvas
#05060f— Az oldal háttere, a kártya legmélyebb felülete, a jelvény kitöltése – egy majdnem fekete alap, amelyen minden más lebeg. - Steel Plate
#2f343e— Kiemelt felület, fantom/másodlagos gombok, diszkrét hátlap. - Fog Veil
#9da7ba— A fő szöveg, a kártyán lévő szöveg olvasható, de a címsorokhoz képest a háttérbe szorul. - Moon Mist
#c7d3ea— Fő szöveg, további címkék, némított segédszöveg - Frost Glow
#d1e4fa— A törzs- és hivatkozásszöveg, az ikonszöveg és az ikonkitöltés elsődleges kitöltőszíne az alapértelmezett világító előtér. - Ice Highlight
#d8ecf8— Világos szöveg sötét felületeken, fordított címkék és nagy kontrasztú címsorok. Ne használd elsődleges színként cselekvésre ösztönzésekhez; az AuthKit logóban és a fő címsorokban címsorátmenetet – a világoskéktől a lágy kékig tartó sima átmenetet fentről lefelé – használunk.
Tipográfia
12-től 48 képpontig · 8 lépésben
- Untitled Sans — csere: Inter · körvonalak 400, 500, 600, 700 · Fő szöveg, felhasználói felület, gombok, beviteli mezők, ikonok, kis címsorok – univerzális betűtípus minden funkcionális dologhoz.
- aeonikPro — csere: Space Grotesk · körvonalak 400, 500 · Ha csak a címsorokat – az AuthKit márkajelzést, a szakaszcímeket és a törzsszöveget – jelenítjük meg, az 500 pontos betűvastagság 44-48 képpont méretben széles, visszafogott megjelenést kölcsönöz a márkajelzésnek, nem pedig egy hivalkodó hangsúlyt.
- dotDigital — csere: JetBrains Mono · körvonalak 400 · Csupa nagybetűs szöveg („Bemutatkozik”, „Bővíthető dizájn”, „Ragyogj fényesen”) – az egysoros, csupa nagybetűs szöveg 0,10 mm térközzel finom elválasztóként szolgál a törzsszöveg és a címsor között.
Intervallumok és forma
| Cél | Jelentés |
|---|---|
| Sűrűség | tágas |
| Alapvető lépés | 16px |
| Gomb sugara | 999px |
| Kártya sugara | 16px |
| Árnyékok | nincs - szegélyek árnyékok helyett |
| Szakaszok között | 120px |
| Oldal szélessége | 1200px |
A mesterséges intelligencia Authkit stílusban fogja elkészíteni a weboldaladat, és kitölti azt.
- Töltsd fel termékeidet és posztjaidat a linkeken keresztül - Instagram, TikTok, Facebook.
- Tartalom átvitele régi webhelyéről – csak adja meg a címet.
- Modern dizájn a legjobb keresőmotoron: React ( Next.js) szerveralapú rendereléssel és SEO optimalizálással, azonnal használható formában.
- Teljesen automatizált SEO optimalizálás a keresési eredményekhez és a neurális hálózati ajánlásokhoz.
Hasonló stílusok
- Resend — fekete bársony lila neon színnel
- Gsap — Egy animált tábla egy tervezőstúdióban. Majdnem fekete fal, meleg krémszínű kréta és öt színes filctoll – minden animációs szakághoz egy.
- Slash — Éjféli trezor aranyozott főkönyvekkel
- Raycast — Éjféli Parancsnoki Központ, Coral Neon
- Dimension — szürkületkor megvilágított munkaállomás matt üvegpanelekkel
- Modal — Egy foszforeszkáló terminál egy elsötétített szerverszobában - az egyetlen fényforrás egy élénkzöld színű
- Reflect Notes — A csillagos ibolyaszínű űr egy sötét obszervatórium, ahol a hangjegyek csillagképekként lebegnek a szinte fekete indigó üresség hátterében.
- LaunchDarkly — A neonfényes irányítóterem egy sötét pilótafülke, ahol lila fények pulzálnak a koromfekete paneleken keresztül.
- Ameba — Az irányítóterem éjfélkor – elektromos kék pulzálás matt üvegpanelekben
- AgentQL — Északi fény a terminál felett éjszaka
- Neon — Egy szerverszoba sötétedés után. Tiszta sötétség, ahol az egyetlen fény az adatokból és a felhasználói interakciókból származik.
- N8n — Workflow Engine at Midnight – egy valós idejű automatizálási vászon érzete egy sötét szerverszobában, állapotjelzőkkel és adatfolyamokkal megvilágítva