0

مولد التدرج CSS

أنشئ تدرجات CSS بشكل مرئي: النوع الخطي أو الشعاعي أو المخروطي ومنزلق الزاوية وما يصل إلى ستة توقفات لونية مع معاينة مباشرة كاملة العرض وتعليمة برمجية قابلة للنسخ.

90°
جارٍ المعالجة... 0%

النتيجة

تعد كتابة التدرج الخطي (135deg, #2193b0 0%, #6dd5ed 100%) يدويًا وإعادة تحميل الصفحة لرؤيتها بمثابة حلقة بطيئة. يقوم هذا المولد بإغلاقه: اختر خطيًا أو شعاعيًا أو مخروطيًا، واسحب شريط تمرير الزاوية، واضبط كل نقطة توقف لونية باستخدام منتقي الألوان الأصلي وموضع النسبة المئوية - ويتم إعادة رسم المعاينة بالعرض الكامل على كل إدخال على حدة، مع خط الخلفية النهائي جاهز دائمًا للنسخ.

تغطي أنواع التدرج الثلاثة وظائف مختلفة. تتلاشى التدرجات الخطية على طول الاتجاه وتحمل معظم أقسام وأزرار البطل؛ تشع التدرجات الشعاعية من المركز للتوهجات والمقالات القصيرة؛ تكتسح التدرجات المخروطية حول المركز ومخططات دائرية قوية وعجلات الألوان. يمكنك تبديل الأنواع في أي لحظة - يتم ترحيل نقاط الوقف الخاصة بك، لذا فإن المقارنة بين الثلاثة تستغرق ثوانٍ.

يمنحك ما يصل إلى ستة توقفات لونية مساحة لتصميمات متعددة النطاقات، كما توفر الصفحات المعدة مسبقًا مجموعات مثبتة - غروب الشمس الدافئ، والمحيط الهادئ، وزوج من ألوان الباستيل الناعمة - كنقاط بداية يمكنك تعديلها بدلاً من اللوحات الفارغة. لاحظ تقسيم العمل: يقوم منشئ لوحة الألوان الموجود على هذا الموقع باختيار ألوان مسطحة متناغمة ويقوم محول تنسيق الألوان بترجمة قيمة بين HEX وRGB وHSL، بينما تقوم هذه الأداة بمهمة مختلفة - فهي تحول الألوان المختارة إلى كود تدرج CSS جاهز.

يتم تشغيل كل شيء محليًا في متصفحك: لا يوجد تحميل، ولا يوجد حساب، ولا يوجد خادم ذهابًا وإيابًا، ويستمر المولد في العمل دون اتصال بمجرد تحميله.