Authkit
كاتدرائية الزجاج المصنفر في منتصف الليل
يُضفي AuthKit جماليةً مميزةً لعرض المنتجات ليلاً: لوحة سوداء تقريبًا بأسطح زجاجية مصنفرة، وشبكة من الخطوط شبه المرئية، ونص متوهج يبدو وكأنه مُضاء بطبقة زجاجية. الخط أبيض بالكامل تقريبًا على خلفية داكنة، مع لمسة أرجوانية زاهية واحدة كعنصر وظيفي وحيد - كل سطح تفاعلي له خط ناعم ورفيع من الأزرق المائل للبياض بدلاً من إطار صلب. تُرتّب المكونات على طبقات شفافة، فوق توهج محيطي، وتظهر البطاقات كألواح زجاجية مضاءة من الأسفل، بدلاً من ألواح ورقية. المسافات واسعة وإيقاعية؛ العنصر الرئيسي هو شعار مضيء واحد يمتد على كامل عرض الصفحة، محاط ببطاقات زجاجية عائمة، بدلاً من تصميم الشاشة المنقسمة التقليدي.
لوحة داكنة بعرض كامل، تحتوي على حاوية محتوى مركزية، بحد أقصى 1200 بكسل. العنصر الرئيسي عبارة عن شعار مضيء مركزي واحد ("AuthKit" بخط متدرج) أسفل نص صغير على شكل حاجب، وخلفه/أسفله ثلاث بطاقات زجاجية عائمة تحتوي على نموذج تسجيل دخول (البطاقة اليسرى مائلة لليسار، والبطاقة الوسطى مكبّرة، والبطاقة اليمنى مائلة لليمين). يوجد زر تبديل الوضع الفاتح/الداكن في المنتصف أسفل العنصر الرئيسي. صف الميزات عبارة عن خط زمني أفقي من 6 أيقونات بخطوط رفيعة تربط بين الأيقونات الدائرية. إيقاع الأقسام: يبدأ كل قسم بنص مركزي على شكل حاجب محاط بخطوط أفقية متلاشية، يليه عنوان كبير مركزي (44-48 بكسل)، ثم سطر واحد من نص أساسي باهت (16-18 بكسل)، بحد أقصى عرض 640 بكسل تقريبًا. يعرض قسم التخصيص نموذجًا أوليًا لنافذة متصفح مع بطاقة تسجيل دخول مركزية محاطة بلوحات فحص واجهة المستخدم العائمة (لوحات الألوان، وأشرطة التمرير الدائرية، ومحدد أيقونة الشعار، وحقل نص الزر، وحقل خلفية الصفحة) الموجودة في زوايا اللوحة، مثل مساحة عمل أدوات التصميم.
يهيمن على التصميم المرئي نماذج أولية لاستمارات تسجيل الدخول، مصممة بأسلوب "التشكيل الزجاجي" (حقول إدخال البريد الإلكتروني/كلمة المرور، أزرار تسجيل الدخول إلى وسائل التواصل الاجتماعي، إدخال رمز بدون كلمة مرور)، معروضة كبطاقات شفافة عائمة على خلفية داكنة. أيقونات الميزات عبارة عن رموز خطية أحادية اللون (#d1e4fa) داخل مربعات دائرية غير لامعة. شبكة دقيقة (خطوط 1 بكسل بلون rgba(186,215,247,0.06)) تغطي الصفحة بأكملها، مما يخلق جوًا مميزًا، بينما يتلألأ ضوء مخروطي متدرج في أعلى العنصر الرئيسي. لا صور، لا صور نمط حياة، لا لقطات شاشة للمنتج - المنتج نفسه هو العنصر المرئي: حقول تسجيل الدخول مرتبة كنماذج أولية زجاجية في استوديو مظلم.
لوحة الألوان
ماركة
- Void Violet
#663af3— اللون الأساسي لزر دعوة المستخدم لاتخاذ إجراء (CTA) هو لون التمييز الوحيد المستخدم حصريًا لزر "متابعة/إرسال" داخل نماذج تسجيل الدخول؛ اللون الأرجواني النابض بالحياة على خلفية سوداء تقريبًا يخلق إحساسًا بالإلحاح دون الإخلال بنظام الألوان أحادي اللون.
حيادي
- Midnight Canvas
#05060f— خلفية الصفحة، وأعمق سطح للبطاقة، وحشوة الشارة - قاعدة سوداء تقريبًا يطفو عليها كل شيء آخر. - Steel Plate
#2f343e— سطح مرتفع، أزرار عمل ثانوية/وهمية، لوحة خلفية منفصلة. - Fog Veil
#9da7ba— النص الرئيسي، النص الموجود على البطاقة، قابل للقراءة، ولكنه يقع في الخلفية مقارنة بالعناوين. - Moon Mist
#c7d3ea— النص الرئيسي، والتسميات الإضافية، والنص المساعد الخافت - Frost Glow
#d1e4fa— لون التعبئة الأساسي لنص الجسم ونص الروابط ونص الأيقونات وتعبئة الأيقونات هو لون المقدمة المتوهج الافتراضي. - Ice Highlight
#d8ecf8— نص فاتح على أسطح داكنة، وتسميات معكوسة، وعناوين رئيسية عالية التباين. لا تستخدمه كلون أساسي لعبارات الحث على اتخاذ إجراء؛ يُستخدم تدرج لوني للعناوين الرئيسية - انتقال سلس من الأزرق الفاتح إلى الأزرق الداكن من الأعلى إلى الأسفل - في شعار AuthKit والعناوين الرئيسية.
الطباعة
من 12 إلى 48 بكسل · 8 خطوات
- Untitled Sans — الاستبدال: Inter · الخطوط العريضة 400, 500, 600, 700 · النص الرئيسي، واجهة المستخدم، الأزرار، حقول الإدخال، الأيقونات، العناوين الصغيرة - خط عالمي لكل شيء وظيفي.
- aeonikPro — الاستبدال: Space Grotesk · الخطوط العريضة 400, 500 · إن عرض العناوين فقط - العلامة التجارية لـ AuthKit وعناوين الأقسام ونص الصفحة - باستخدام وزن خط 500 نقطة عند 44-48 بكسل يمنح العلامة التجارية مظهرًا واسعًا وبسيطًا بدلاً من مظهر مبهرج.
- 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 — محرك سير العمل في منتصف الليل - شعور بلوحة أتمتة في الوقت الفعلي في غرفة خوادم مظلمة، مضاءة بمؤشرات الحالة وتدفقات البيانات