CSS Button Generator
أزرار مصممة بالجينات برمز CSS
tools.buttonGenerator.title
tools.buttonGenerator.description
.click-me {
padding: 12px 18px;
font-size: 16px;
font-weight: 600;
border-radius: 4px;
border: none;
background-color: #3B82F6;
color: #FFFFFF;
cursor: pointer;
}
.click-me:hover {
background-color: #2563EB;
}صمم أزرارًا مخصصة باستخدام تصميم CSS باستخدام منشئ الأزرار الخاص بنا. قم بإنشاء أزرار مصممة بألوان وأحجام وحدود وتأثيرات تمرير لمشاريع الويب الخاصة بك.
Key Features
نص زر قابل للتخصيص والتصميم
منتقي الألوان لألوان الخلفية والنص
حشوة قابلة للتعديل وحجم الخط ونصف قطر الحدود
خيارات وزن الخط والنمط
تصميم الحدود (لا شيء، متصل، متقطع، منقط)
تحديد لون تأثير التحويم
مولد الأزرار
أدخل نص الزر
اكتب نص التسمية الذي تريده أن يظهر على الزر
تخصيص الألوان
استخدم منتقي الألوان لتعيين ألوان الخلفية والنص والمرور
ضبط الأبعاد
قم بتعيين الحشو وحجم الخط ونصف قطر الحدود للتحجيم
إضافة التصميم
اختر وزن الخط وحدد نمط الحدود إذا رغبت في ذلك
نسخ CSS
انقر فوق "نسخ" للحصول على كود CSS للزر المصمم الخاص بك
Use Cases
إنشاء أزرار الحث على اتخاذ إجراء للصفحات المقصودة
تصميم أنماط أزرار متناسقة لتطبيقات الويب
إنشاء حالات تمرير الزر للحصول على تعليقات تفاعلية
نماذج أولية لمكونات واجهة المستخدم لأنظمة التصميم
Frequently Asked Questions
هل يمكنني إنشاء حالات زر مختلفة؟
نعم، يقوم المولد بإنشاء كل من الحالة العادية وحالة التمرير CSS تلقائيًا
ما هي فئات CSS التي يتم إنشاؤها؟
تقوم الأداة بإنشاء أسماء الفئات الدلالية بناءً على نص الزر
هل يمكنني تخصيص أنماط الحدود؟
نعم، اختر من بين الحدود الصلبة أو المتقطعة أو المنقطة أو المزدوجة ذات العرض المخصص
هل الكود جاهز للإنتاج؟
نعم، تم تحسين جميع ملفات CSS التي تم إنشاؤها وجاهزة للاستخدام في الإنتاج
Tool Information
Related Tools You Might Like
مولدات الكولور باليت من طراز Image
إستخراج الألوان المهيمنة من الصورة
RGB/HEX Converter
Convert between RGB and HEX color formats
المولدات الرئيسية
إنشاء طبقات برمجيات برمجيات برمجية مجهزة بالأشعة المقطعية
WCAG Contrast checker
مقارنة لون الشيكات وفقاً لمعايير فريق التقييم العالمي
مولد التوقيع الرقمي
:: إنشاء توقيعات رقمية مثبتة بعلامات مختلفة
مولدات الظل
الظلال في صندوق الإنقاذ
محاسبة فولوم
قم بحساب حجم اللوحة المثالي بناءً على وزنك ومستوى خبرتك وظروف الموجات.
متعهد الموجات الثقيلة
Convert between different wave altitude measurements (face altitude, Hawaiian scale, ocean swell).
مخطط سكوبا
نخطط لغطس سكوبا مع حدود العمق، والوقت السفلي، ومتطلبات الاكتئاب الآمن.