صانع التدرّجات
ويبصمّم تدرّجات CSS وانسخ الكود بنقرة واحدة.
ما هي أداة صانع التدرّجات؟
صمّم تدرج الألوان بصرياً وانسخ كود CSS جاهزاً للاستخدام بضغطة واحدة. مولد تدرج الالوان CSS هذا يدعم التدرجات الخطية والدائرية بعدد يصل إلى ٦ نقاط لونية: اختر ألوانك، وحدّد موضع كل نقطة، واضبط الزاوية، وستكتب الأداة سطر الخلفية بدلاً منك. يغطي المهام الشائعة — خلفية متدرجة الالوان لواجهة موقع، أو تأثير زر، أو لمسة خفيفة على بطاقة، أو خلفية جريئة لبوستر — من غير الإعلانات المزعجة المنتشرة في مواقع التدرجات.
من الداخل، تدرج CSS هو سطر كود واحد: linear-gradient(زاوية، نقاط لونية) يرسم الألوان في اتجاه محدد، بينما radial-gradient(دائرة، نقاط لونية) يمزجها من المركز إلى الخارج. المولد يبني هذا السطر مباشرة أثناء التعديل، فالمعاينة التي تراها هي بالضبط الكود الذي ستنسخه — الصقه في أي ملف تنسيقات أو إعداد Tailwind أو نمط مباشر وسيعمل فوراً.
كل شيء يعمل داخل المتصفح: لا يُرفع أي شيء، ولا يلزم حساب، ولا توجد قوالب مقفولة أو حدود للنسخ — كل الأدوات مجانية. والصفحة تعمل على الموبايل مثل الكمبيوتر، وهو ما ينقص أغلب أدوات تدرج الالوان اون لاين المتاحة بالعربية. استخدمها مع منتقي الألوان في Carbide: اختر لون علامتك وكود HEX الخاص به هناك، ثم ابنِ حوله خلفية متدرجة هنا.
كيفية استخدام صانع التدرّجات
- اختر نوع التدرج: خطي أو دائري.
- اختر لوناً لكل نقطة — أضف حتى ٦ نقاط لونية لتدرجات أكثر تعقيداً.
- حرّك موضع كل نقطة للتحكم في أماكن امتزاج الألوان.
- في التدرج الخطي، اضبط الزاوية للتحكم في اتجاه الامتزاج.
- انسخ كود CSS الناتج بضغطة واحدة والصقه في ملف التنسيقات.
الأسئلة الشائعة
ازاي أنسخ كود CSS؟
اضغط زر النسخ وسينتقل سطر الخلفية كاملاً — مثل background: linear-gradient(90deg, #FF4D00 0%, #2F6BFF 100%); — إلى الحافظة، جاهزاً للصق في أي ملف تنسيقات أو خاصية نمط.
ما الفرق بين التدرج الخطي والدائري؟
التدرج الخطي يمزج الألوان على خط مستقيم بالزاوية التي تختارها — مناسب للخلفيات والأزرار. والتدرج الدائري يمزجها من المركز إلى الخارج في شكل دائرة — مناسب لتأثيرات التوهج والإضاءة. تقدر تبدّل بينهما بضغطة واحدة مع الاحتفاظ بنفس الألوان.
هل أقدر أصدّر التدرج كصورة؟
الأداة تعطيك كود CSS وليس ملف صورة. وللويب الكود أفضل — يتمدد لأي حجم بدون أي وزن للملف. ولو محتاج صورة من التدرج، طبّق الكود على عنصر وخذ لقطة شاشة.
كم لوناً أقدر أستخدم في التدرج الواحد؟
من نقطتين إلى ٦ نقاط لونية. نقطتان تعطيان مزيجاً نظيفاً، والنقاط الأكثر تتيح تدرجات بأسلوب الغروب أو بألوان علامة تجارية متعددة.
هل مولد التدرجات مجاني؟
نعم — مجاني بالكامل بدون تسجيل، وبدون قوالب مقفولة، وبدون حد لعدد التدرجات التي تصممها أو تنسخها.
هل يُرفع أي شيء عن تصميمي؟
لا. المولد يعمل بالكامل داخل متصفحك؛ ألوانك وكودك لا يغادران جهازك.
هل يعمل على الموبايل؟
نعم. كل عناصر التحكم تعمل في متصفحات الموبايل، فتقدر تصمم التدرج وتنسخ كود CSS من هاتفك.
