مطالبات منشئي تطبيقات الذكاء الاصطناعي

مطالبات لمنشئي تطبيقات الذكاء الاصطناعي: HTML وCSS وJavaScript.

تحوّل أدوات مثل Bolt وLovable وv0 وCursor مطالبة واحدة إلى صفحة HTML تعمل. المطالبات أدناه مكتوبة لمخرجات HTML وCSS وJavaScript ثابتة — كل نتيجة صفحة يمكنك معاينتها ومشاركتها فورا.

معاينة HTML المُنشأ قراءة الأسئلة

npx @htmlshare/cli install --agent all

أمر واحد يثبت Skill المحلي لـ Codex وClaude وCursor. بعد التثبيت، استخدم /htmlshare في أي منها لنشر مشروع HTML الحالي.

نشر يدوي

مطالبات جاهزة للنسخ

انسخ مطالبة والصقها في منشئ الذكاء الاصطناعي.

صفحات الهبوط

تخطيطات صفحات كاملة مع قسم hero وشبكة ميزات وجدول أسعار.

ابنِ صفحة هبوط SaaS بعناوين hero جريئة وزر CTA، وشبكة ميزات من 3 أعمدة مع أيقونات، وجدول أسعار من مستويين (free وpro)، وأكورديون FAQ. استخدم HTML وTailwind CSS عبر CDN وJavaScript العادي للأكورديون. أبقِ كل شيء في ملف واحد.

أنشئ صفحة إطلاق منتج بسيطة بقسم hero بملء الشاشة ونموذج جمع بريد وقائمة من 5 ميزات. بلا اعتماديات خارجية — اجعل كل CSS مضمنا.

مكوّنات الواجهة

أجزاء قابلة لإعادة الاستخدام مثل شريط التنقل والبطاقات والنوافذ والعلامات.

ابنِ شريط تنقل متجاوبا: شعار يسارا، 4 روابط في الوسط، وزر Get started يمينا. أضف قائمة همبرغر للشاشات الصغيرة. HTML وCSS فقط، بلا مكتبات JavaScript.

أنشئ مجموعة بطاقات من 3 أنماط: بطاقة ميزة بأيقونة ووصف، وبطاقة تسعير بقائمة ميزات وCTA، وبطاقة شهادة بصورة اقتباس. استخدم HTML وخصائص CSS المخصصة.

تخطيطات لوحة التحكم

لوحات إدارة وبطاقات إحصاءات وتخطيطات عرض البيانات.

أنشئ لوحة إدارة بشريط أيقونات جانبي ثابت، وشريط علوي بحقل بحث وقائمة صورة المستخدم، ومنطقة رئيسية تعرض 4 بطاقات إحصاء وجدولا بيانات بديلا. استخدم HTML وCSS Grid.

ابنِ صفحة تحليلات متجاوبة بمنتقى نطاق تاريخ و3 بطاقات KPI في الأعلى ومخطط أعمدة بـ CSS وHTML فقط (بلا canvas أو مكتبات SVG). أضف جدول بيانات أسفلها.

عناصر تفاعلية

نماذج متعددة الخطوات وأكورديونات وعلامات ونوافذ حوار.

ابنِ نموذجا من 3 خطوات: معلومات شخصية، وتفضيلات الحساب، وملخص تأكيد. اعرض شريط تقدم في الأعلى. استخدم HTML وCSS وJavaScript العادي — بلا مكتبات أو أطر.

أنشئ واجهة علامات من 4 تبويبات مع انتقالات سلسة. كل لوحة تحتوي عنوانا وفقرة. استخدم HTML وانتقالات CSS وJavaScript العادي.

مزيد من مصادر المطالبات

أين تجد مزيدا من مطالبات منشئي HTML.

إضافة إلى القوالب أعلاه، هذه أفضل الأماكن للعثور على مطالبات مجرّبة لأدوات HTML وCSS بالذكاء الاصطناعي.

مستودعات المطالبات على GitHub

ابحث في GitHub عن "bolt prompts" أو "v0 prompts" أو "ai html prompts" للعثور على مكتبات مطالبات يديرها المجتمع ومجموعات البداية.

مجتمعات Reddit

r/ChatGPT وr/ClaudeAI وr/webdev تشارك بانتظام قوالب المطالبات وتناقش ما ينجح لتوليد HTML وCSS نظيفين.

وثائق منشئي الذكاء الاصطناعي

تنشر Bolt.new وLovable وv0 by Vercel وCursor أمثلة مطالبات وأفضل الممارسات في وثائقها الرسمية وخوادم Discord.

معارض الأمثلة

تصفح الأمثلة المنشورة في Bolt Gallery ومجتمع v0 لاستنتاج مطالبات فعالة من النتائج التي تريد تكرارها.

أين أحصل على مطالبات منشئي تطبيقات الذكاء الاصطناعي؟

ابدأ بمستودعات GitHub ذات الوسوم 'ai-prompts' أو 'bolt-prompts'، ووثائق منشئك الرسمية (Bolt وv0 وLovable وCursor)، ومجتمعات Reddit (r/ChatGPT وr/ClaudeAI). يمكن نسخ مطالبات هذه الصفحة ولصقها مباشرة.

ما الذي يجعل مطالبة HTML وCSS جيدة لمنشئ الذكاء الاصطناعي؟

حدد التخطيط (CSS Grid أو Flexbox)، وسرد كل قسم تحتاجه (hero وfeatures وpricing وFAQ)، وسمّ أسلوب التنسيق (Tailwind CDN أو CSS مضمن أو كتلة style منفصلة)، وأنهِ بجملة «Keep everything in one HTML file.» كلما كانت المطالبة أدق كان الناتج أكثر استقرارا.

كيف أعاين HTML الذي أنشأه منشئ الذكاء الاصطناعي وأشاركه؟

الصق ملف HTML المُنشأ أو ارفعه إلى HTMLShare. تنشئ الخدمة فورا رابط معاينة متصفح قابلا للمشاركة — بلا مستودع Git أو إعداد استضافة أو خادم محلي. استخدمه للتحقق من النتيجة ومشاركتها مع الفريق أو العملاء.