منشئ تدرجات CSS
صمّم تدرجات CSS خطية ودائرية ومخروطية مع معاينة حية، وانسخ الكود مباشرة.
842 مشاهدة
تدرجات CSS
التدرج هو انتقال ناعم بين الألوان، يُكتب على شكل linear-gradient(الزاوية, لون1, لون2) أو radial-gradient(...) أو conic-gradient(...). اختر النوع والزاوية وحتى ثلاثة ألوان — تتحدث المعاينة والكود الجاهز للنسخ فورًا. تُرسم التدرجات بواسطة المتصفح نفسه، فلا تحتاج إلى تحميل صورة وتبقى واضحة تمامًا مهما كان الحجم.
الأسئلة الشائعة
ماذا تعني الزاوية في التدرج الخطي؟
0° تشير إلى الأعلى، 90° إلى اليمين، 180° إلى الأسفل — الزاوية هي الاتجاه الذي يتحرك نحوه التدرج. الزاوية 135° تعطي القطر الشائع من أعلى اليسار إلى أسفل اليمين.
متى أستخدم radial أم conic؟
radial يمتزج من المركز إلى الخارج — مناسب للأضواء المركزة والتظليل الحوافي. conic يدور حول المركز كعجلة الألوان — مناسب للرسوم الدائرية وحلقات قوس قزح.
أدوات مشابهة
منشئ ظل الصندوق CSS
صمّم ظل الصندوق (box-shadow) بصريًا — الإزاحات، التمويه، الانتشار، اللون، الشفافية وinset — مع معاينة حية.
أنشئ
منشئ استدارة الحواف CSS
دوّر كل زاوية على حدة أو جميعها معًا، بوحدة px أو %، مع معاينة حية وكود CSS قابل للنسخ.
أنشئ
منشئ ظل النص CSS
صمّم ظل نص (text-shadow) بتحديد الإزاحة والتمويه واللون والشفافية — مع معاينة حية على نص تجريبي.
أنشئ
منشئ حدود CSS
صمّم حدًا بصريًا — السماكة، النمط (solid, dashed, dotted, double…)، اللون، ونصف القطر — مع معاينة حية.
أنشئ
الإبلاغ عن مشكلة
منشئ تدرجات CSS