مولّد ظل CSS
أنشئ خاصية box-shadow في CSS بصرياً باستخدام أشرطة التمرير. شاهد معاينة مباشرة وانسخ شفرة CSS. يدعم الظلال الخارجية والداخلية وتعدد الظلال.
الاستوديو · محيط محايد
الميزات
Slider controls
Color picker
Inset toggle
Multiple layers
Live preview & CSS code
طريقة الاستخدام
1. شكّل الظل بأشرطة التمرير — البطاقة المحايدة في منطقة العمل تُظهر النتيجة النهائية تمامًا.
2. الظلال الواقعية متعددة الطبقات: أضف حتى أربع طبقات، أو ابدأ من إعداد جاهز (Soft / Elevated / Floating / Inner).
3. بدّل الخلفية لفحص الظل على الأبيض والرمادي والداكن، ثم انسخ CSS.
الأسئلة الشائعة
What is box-shadow?
The CSS box-shadow property adds shadow effects around an element's frame.
أدوات ذات صلة
مولّد تدرجات CSS
أنشئ تدرجات CSS خطية وشعاعية ومخروطية بصرياً. أضف نقاط توقف ألوان متعددة وانسخ ش...
مولّد حواف CSS المستديرة
صمّم خاصية border-radius في CSS بصرياً — تحكم في الزوايا الأربع فردياً أو معاً. ...
ساحة تجارب CSS Flexbox
تعلّم وجرّب CSS Flexbox عملياً. اضبط خصائص الحاوية وشاهد تحديث التخطيط مباشرة. أ...
مولّد CSS Grid
أنشئ تخطيطات CSS Grid بصرياً. حدد الصفوف والأعمدة والفجوات وانسخ شفرة CSS وHTML ...