Authkit
आधी रात में फ्रॉस्टेड ग्लास कैथेड्रल
AuthKit एक रात्रिकालीन उत्पाद प्रस्तुति का आकर्षक दृश्य प्रस्तुत करता है: लगभग काले रंग का कैनवास, धुंधली कांच जैसी सतहें, मुश्किल से दिखाई देने वाली रेखाओं का ग्रिड और चमकता हुआ टेक्स्ट जो कांच की परत से प्रकाशित प्रतीत होता है। फ़ॉन्ट लगभग पूरी तरह से सफेद है और पृष्ठभूमि गहरी है, जिसमें केवल एक चमकीला बैंगनी रंग ही एकमात्र कार्यात्मक तत्व है—प्रत्येक इंटरैक्टिव सतह पर कठोर फ्रेम के बजाय ठंडी नीली-सफेद रंग की एक कोमल, पतली रेखा है। घटक पारदर्शी परतों पर व्यवस्थित हैं, जो एक परिवेशी चमक के ऊपर बिछी हैं, और कार्ड कागज़ के पैनल के बजाय नीचे से प्रकाशित कांच की प्लेटों की तरह दिखाई देते हैं। स्पेसिंग बड़ी और लयबद्ध है; मुख्य तत्व एक ही प्रकाशित लोगो है जो पृष्ठ की पूरी चौड़ाई में फैला हुआ है, और पारंपरिक स्प्लिट-स्क्रीन लेआउट के बजाय तैरते हुए कांच के कार्डों से घिरा हुआ है।
एक पूर्ण चौड़ाई वाला, गहरे रंग का कैनवास, जिसके केंद्र में अधिकतम 1200px चौड़ाई का कंटेंट कंटेनर है। मुख्य तत्व एक एकल, केंद्र में स्थित, प्रकाशित लोगो ("AuthKit" ग्रेडिएंट फ़ॉन्ट में) है, जिसके नीचे एक छोटा सा भौंह के आकार का टेक्स्ट है। इसके पीछे/नीचे तीन तैरते हुए ग्लास कार्ड हैं जिनमें लॉगिन फ़ॉर्म फैला हुआ है (बायां कार्ड बाईं ओर झुका हुआ, केंद्र कार्ड अधिकतम आकार में, दायां कार्ड दाईं ओर झुका हुआ)। मुख्य तत्व के ठीक नीचे केंद्र में एक लाइट/डार्क थीम टॉगल दिया गया है। फ़ीचर पंक्ति 6 आइकनों की एक क्षैतिज टाइमलाइन है, जिनके बीच पतली कनेक्टिंग लाइनें हैं। सेक्शन रिदम: प्रत्येक सेक्शन की शुरुआत केंद्र में स्थित भौंह के आकार के टेक्स्ट से होती है, जो धुंधली क्षैतिज लाइनों से घिरा होता है। इसके बाद एक बड़ा, केंद्र में स्थित शीर्षक (44-48px) होता है, और अंत में म्यूट बॉडी टेक्स्ट (16-18px) की एक पंक्ति होती है, जिसकी अधिकतम चौड़ाई लगभग 640px है। कस्टमाइज़ सेक्शन में एक ब्राउज़र विंडो का मॉकअप प्रदर्शित होता है, जिसके केंद्र में एक लॉगिन कार्ड होता है और उसके चारों ओर फ्लोटिंग यूआई इंस्पेक्टर पैनल (कलर पैलेट, रेडियस स्लाइडर, लोगो आइकन सेलेक्टर, बटन टेक्स्ट फील्ड, पेज बैकग्राउंड फील्ड) कैनवास के कोनों पर स्थित होते हैं, जैसे कि एक डिज़ाइन टूल वर्कस्पेस।
दृश्य डिज़ाइन में लॉगिन फ़ॉर्म मॉकअप्स का प्रभुत्व है, जिन्हें "ग्लास मॉर्फोलॉजी" शैली में तैयार किया गया है (ईमेल/पासवर्ड इनपुट फ़ील्ड, सोशल मीडिया लॉगिन बटन, पासवर्ड-रहित कोड प्रविष्टि), और इन्हें गहरे काले रंग के कैनवास पर तैरते हुए, पारदर्शी कार्ड के रूप में प्रस्तुत किया गया है। फ़ीचर आइकन गोल, मैट टाइल्स के भीतर #d1e4fa रंग में मोनोक्रोम रैखिक ग्लिफ़ हैं। एक सूक्ष्म ग्रिड (rgba(186,215,247,0.06) में 1px लाइनें) पूरे पृष्ठ को कवर करती है, जिससे एक आकर्षक वातावरण बनता है, जबकि मुख्य तत्व के शीर्ष पर एक शंक्वाकार ग्रेडिएंट स्पॉटलाइट चमकती है। कोई फ़ोटो नहीं, कोई जीवनशैली चित्र नहीं, कोई उत्पाद स्क्रीनशॉट नहीं—उत्पाद स्वयं ही दृश्य तत्व है: लॉगिन फ़ील्ड एक अंधेरे स्टूडियो में कांच के प्रोटोटाइप की तरह व्यवस्थित हैं।
पैलेट
ब्रांड
- Void Violet
#663af3— कॉल-टू-एक्शन (CTA) बटन का प्राथमिक रंग लॉगिन फॉर्म के भीतर "जारी रखें/सबमिट करें" बटन के लिए विशेष रूप से उपयोग किया जाने वाला एकमात्र एक्सेंट रंग है; लगभग काले रंग की पृष्ठभूमि के विपरीत चमकीला बैंगनी रंग एकरंगी रंग योजना को बाधित किए बिना तात्कालिकता की भावना पैदा करता है।
तटस्थ
- Midnight Canvas
#05060f— पृष्ठ की पृष्ठभूमि, कार्ड की सबसे गहरी सतह, बैज की भराई—एक लगभग काला आधार जिस पर बाकी सब कुछ तैरता है। - Steel Plate
#2f343e— उभरी हुई सतह, फैंटम/सेकेंडरी एक्शन बटन, सूक्ष्म पैनल बैकिंग। - Fog Veil
#9da7ba— कार्ड पर लिखा मुख्य पाठ पठनीय है, लेकिन शीर्षकों की तुलना में वह पृष्ठभूमि में चला जाता है। - Moon Mist
#c7d3ea— मुख्य पाठ, अतिरिक्त लेबल, म्यूट किया हुआ सहायक पाठ - Frost Glow
#d1e4fa— बॉडी और लिंक टेक्स्ट, आइकन टेक्स्ट और आइकन फिल के लिए प्राथमिक फिल रंग डिफ़ॉल्ट ग्लोइंग फोरग्राउंड है। - Ice Highlight
#d8ecf8— गहरे रंग की सतहों पर हल्के रंग का टेक्स्ट, उल्टे लेबल और उच्च कंट्रास्ट वाली हेडलाइन। इसे कॉल टू एक्शन के लिए प्राथमिक रंग के रूप में उपयोग न करें; ऑथकिट लोगो और मुख्य हेडलाइनों में हेडलाइन ग्रेडिएंट—ऊपर से नीचे तक हल्के नीले से मृदु नीले रंग का सहज संक्रमण—का उपयोग किया गया है।
टाइपोग्राफी
12 से 48px तक · 8 चरण
- Untitled Sans — प्रतिस्थापन: Inter · रूपरेखा 400, 500, 600, 700 · मुख्य पाठ, यूजर इंटरफेस, बटन, इनपुट फ़ील्ड, आइकन, छोटे शीर्षक - कार्यात्मक हर चीज के लिए एक सार्वभौमिक फ़ॉन्ट।
- aeonikPro — प्रतिस्थापन: Space Grotesk · रूपरेखा 400, 500 · केवल शीर्षकों को प्रदर्शित करते हुए—ऑथकिट ब्रांडिंग, अनुभाग शीर्षक और मुख्य पाठ—44-48px पर 500-पॉइंट फ़ॉन्ट वजन ब्रांडिंग को एक भड़कीले उच्चारण के बजाय एक व्यापक, संयमित रूप देता है।
- dotDigital — प्रतिस्थापन: JetBrains Mono · रूपरेखा 400 · सभी बड़े अक्षरों में लिखा गया पाठ ("परिचय," "विस्तार योग्य डिज़ाइन," "चमकदार") - 0.10em स्पेसिंग के साथ मोनोस्पेस्ड सभी बड़े अक्षरों में लिखा गया पाठ मुख्य पाठ और शीर्षक के बीच सूक्ष्म विभाजक के रूप में कार्य करता है।
अंतराल और रूप
| उद्देश्य | अर्थ |
|---|---|
| घनत्व | विशाल |
| बुनियादी कदम | 16px |
| बटन त्रिज्या | 999px |
| कार्ड त्रिज्या | 16px |
| छैया छैया | नहीं - छाया के बजाय बॉर्डर |
| अनुभागों के बीच | 120px |
| पृष्ठ की चौड़ाई | 1200px |
एआई आपकी वेबसाइट को Authkit शैली में बनाएगा और उसमें डेटा भरेगा।
- इन लिंक के माध्यम से उत्पादों और पोस्ट से भरें - Instagram, TikTok, Facebook ।
- अपनी पुरानी वेबसाइट से सामग्री स्थानांतरित करें—बस पता निर्दिष्ट करें।
- सर्वश्रेष्ठ इंजन पर आधुनिक डिजाइन: React ( Next.js) जिसमें सर्वर रेंडरिंग और एसईओ अनुकूलन की सुविधा अंतर्निहित है।
- खोज परिणामों और न्यूरल नेटवर्क अनुशंसाओं के लिए पूरी तरह से स्वचालित एसईओ अनुकूलन।
समान शैलियाँ
- Resend — काले मखमली कपड़े पर बैंगनी नियॉन रंग
- Gsap — एक डिजाइन स्टूडियो में एनिमेटेड व्हाइटबोर्ड। लगभग काली दीवार, हल्के क्रीम रंग का चॉक और पांच रंगीन मार्कर—प्रत्येक एनिमेशन शैली के लिए एक।
- Slash — सोने से मढ़े बहीखातों वाला आधी रात का तहखाना
- Raycast — मिडनाइट कमांड सेंटर, कोरल नियॉन
- Dimension — धुंधली रोशनी से जगमगाता हुआ, पाले से ढके कांच के पैनलों वाला एक वर्कस्टेशन
- Modal — एक अंधेरे सर्वर कक्ष में एक फास्फोरसेंट टर्मिनल - प्रकाश का एकमात्र स्रोत चमकीला हरा रंग है।
- Reflect Notes — तारों से जगमगाता बैंगनी अंतरिक्ष एक अंधेरी वेधशाला है जहाँ लगभग काले नीले शून्य की पृष्ठभूमि के विरुद्ध स्वर तारामंडलों की तरह तैरते हैं।
- LaunchDarkly — नियॉन कंट्रोल रूम एक अंधेरा कॉकपिट है जहां जेट-ब्लैक पैनलों के माध्यम से बैंगनी रोशनी चमकती है।
- Ameba — आधी रात को नियंत्रण कक्ष – फ्रॉस्टेड ग्लास पैनलों के भीतर एक विद्युत नीली चमक
- AgentQL — रात में टर्मिनल के ऊपर उत्तरी रोशनी
- Neon — अंधेरा होने के बाद एक सर्वर रूम। घोर अंधेरा, जहाँ एकमात्र रोशनी डेटा और उपयोगकर्ता की बातचीत से आती है।
- N8n — आधी रात में वर्कफ़्लो इंजन - एक अंधेरे सर्वर रूम में वास्तविक समय स्वचालन कैनवास का अनुभव, जो स्थिति संकेतकों और डेटा स्ट्रीम से प्रकाशित होता है।