Authkit
Cattedrale di vetru smerigliatu à mezanotte
AuthKit crea una estetica di presentazione di prudutti di notte: una tela quasi nera cù superfici di vetru smerigliatu, una griglia di linee appena visibili è un testu luminosu chì pare illuminatu da un stratu di vetru. U caratteru tipograficu hè quasi interamente biancu contr'à un sfondate scuru, cù un unicu accentu viola brillante cum'è unicu elementu funzionale - ogni superficia interattiva hà una linea dolce è fina di biancu-blu frescu invece di una cornice rigida. I cumpunenti sò disposti nantu à strati traslucidi, stratificati sopra un bagliore ambientale, è e carte appariscenu cum'è lastre di vetru illuminate da sottu, invece di pannelli di carta. A spaziatura hè grande è ritmica; l'elementu principale hè un unicu logò illuminatu chì si estende per tutta a larghezza di a pagina, circundatu da carte di vetru flottanti, invece di un layout tradiziunale à schermu divisu.
Una tela scura à piena larghezza cù un cuntinitore di cuntenutu centratu, larghezza massima 1200px. L'elementu principale hè un unicu logò centratu è illuminatu ("AuthKit" in un carattere sfumatu) sottu à un picculu testu in forma di sopracciglia, daretu à u quale/sottu à u quale trè carte di vetru flottanti cù un furmulariu di login in ventaglio (carta sinistra inclinata à manca, carta centrale massimizzata, carta destra inclinata à diritta). Un tema chjaru/scuru hè centratu sottu à l'elementu principale. A riga di funzioni hè una cronologia orizzontale di 6 icone cù linee di cunnessione sottili trà l'icone circulari. Ritmu di a sezione: ogni sezione principia cù un testu centratu in forma di sopracciglia incorniciatu da linee orizzontali sbiadite, seguitatu da un grande titulu centratu (44-48px), seguitatu da una sola linea di testu di u corpu silenziatu (16-18px), larghezza massima ~640px. A sezione Personalizza mostra un mockup di una finestra di u navigatore cù una carta di login situata centralmente circundata da pannelli di ispezione di l'interfaccia utente flottanti (palette di culori, cursori di raghju, selettore di l'icona di u logò, campu di testu di u buttone, campu di fondu di a pagina) posizionati à l'anguli di a tela, cum'è un spaziu di travagliu di strumenti di cuncepimentu.
U disignu visuale hè duminatu da maquette di moduli di login, create in un stile di "morfologia di vetru" (campi di input email/password, buttoni di login per i social media, input di codice senza password), presentate cum'è carte fluttuanti è traslucide contr'à una tela di mezzanotte. L'icone di funzione sò glifi lineari monocromi in #d1e4fa in tessere tonde è opache. Una griglia sottile (linee di 1px in rgba(186,215,247,0.06)) copre tutta a pagina, creendu atmosfera, mentre un riflettore à gradiente conicu brilla in cima à l'elementu principale. Nisuna foto, nisuna imagine di stile di vita, nisuna screenshot di u produttu - u produttu stessu hè l'elementu visuale: campi di login disposti cum'è prototipi di vetru in un studio scuru.
Paletta
Marca
- Void Violet
#663af3— U culore primariu per u buttone di chjama à l'azzione (CTA) hè l'unicu culore d'accentu utilizatu esclusivamente per u buttone "Cuntinuà/Invià" in i moduli di login; u viulettu vibrante contr'à u fondu quasi neru crea un sensu d'urgenza senza interrompe u schema di culori monocromaticu.
Neutru
- Midnight Canvas
#05060f— U fondu di a pagina, a superficia più prufonda di a carta, u riempimentu di u badge - una basa guasi nera nantu à a quale tuttu u restu flotta. - Steel Plate
#2f343e— Superficie rialzata, buttoni d'azione phantom/secundaria, supportu di pannellu discretu. - Fog Veil
#9da7ba— U testu principale, u testu di a carta, hè leggibile, ma relegatu à u fondu paragunatu à i tituli. - Moon Mist
#c7d3ea— Testu principale, etichette supplementari, testu ausiliariu silenziatu - Frost Glow
#d1e4fa— U culore di riempimentu primariu per u testu di u corpu è di u ligame, u testu di l'icona è u riempimentu di l'icona hè u primu pianu luminosu predefinitu. - Ice Highlight
#d8ecf8— Testu chjaru nantu à superfici scure, etichette invertite è tituli à cuntrastu altu. Ùn l'utilizate micca cum'è culore primariu per e chjame à l'azzione; un gradiente di titulu - una transizione liscia da u turchinu chjaru à u turchinu tenue da cima à fondu - hè adupratu in u logu AuthKit è in i tituli chjave.
Tipografia
da 12 à 48px · 8 passi
- Untitled Sans — rimpiazzamentu: Inter · contorni 400, 500, 600, 700 · Testu principale, interfaccia utente, buttoni, campi di input, icone, picculi tituli - un carattere universale per tuttu ciò chì hè funzionale.
- aeonikPro — rimpiazzamentu: Space Grotesk · contorni 400, 500 · Visualizendu solu i tituli - a marca AuthKit, i tituli di sezzione è u testu di u corpu - un pesu di carattere di 500 punti à 44-48px dà à a marca un aspettu largu è discretu piuttostu chè un accentu vistosu.
- dotDigital — rimpiazzamentu: JetBrains Mono · contorni 400 · Testu tuttu in maiuscule ("Presentazione", "Design espansibile", "Brilli luminosamente") - testu tuttu in maiuscule monospaziatu cù una spaziatura di 0,10 em serve cum'è separatori suttili trà u corpu di u testu è l'intestazione.
Intervalli è forma
| Scopu | Significatu |
|---|---|
| Densità | spaziosu |
| Passu basicu | 16px |
| Raggiu di u buttone | 999px |
| Raggiu di a carta | 16px |
| Ombre | nò - bordi invece di ombre |
| Trà e sezioni | 120px |
| Larghezza di a pagina | 1200px |
L'IA custruisce u vostru situ web in stile Authkit è u riempirà
- Riempite cù prudutti è publicazioni via u ligame - Instagram, TikTok, Facebook.
- Trasferisce u cuntenutu da u vostru vechju situ - basta à specificà l'indirizzu.
- Design mudernu nant'à u megliu mutore: React ( Next.js) cù rendering di u servitore è ottimizazione SEO pronta per l'usu.
- Ottimizazione SEO cumpletamente automatizata per i risultati di ricerca è e raccomandazioni di rete neurale.
Stili simili
- Resend — vellutu neru cù culore neon viola
- Gsap — Una lavagna animata in un studio di design. Un muru guasi neru, gesso crema caldu è cinque marcatori culurati - unu per ogni disciplina d'animazione.
- Slash — Volta di mezzanotte cù registri dorati
- Raycast — Centru di Cummandu di Mezanotte, Coral Neon
- Dimension — una stazione di travagliu illuminata da u crepuscolu cù pannelli di vetru smerigliatu
- Modal — Un terminale fosforescente in una stanza di servitori scura - l'unica fonte di luce hè un culore verde brillanti
- Reflect Notes — U spaziu viulettu stellatu hè un osservatoriu scuru induve e note flottanu cum'è custellazioni contr'à un sfondate di vacuità indaco guasi neru.
- LaunchDarkly — A sala di cuntrollu à u neon hè una cabina di pilotaggio scura induve i signali viola pulsanu attraversu pannelli neri cum'è u jet.
- Ameba — A sala di cuntrollu à mezanotte - un impulsu turchinu elettricu in i pannelli di vetru smerigliatu
- AgentQL — Aurora boreale sopra u terminal di notte
- Neon — Una sala di servitori dopu à u bughju. Bughjura pura, induve l'unica luce vene da i dati è l'interazzione di l'utilizatori.
- N8n — Motore di Flussu di Lavoro à Mezanotte - a sensazione di una tela di automatizazione in tempu reale in una stanza di servitori scura, illuminata da indicatori di statu è flussi di dati