RevealTheme logo

مولّد box-shadow في CSS

أنشئ قيم box-shadow في CSS بصريًا. عاين في الوقت الفعلي وانسخ الـ CSS المولَّد.

box-shadow: 0px 8px 16px 0px #00000033;

ما هو مولّد box-shadow في CSS؟

تقبل خاصية box-shadow في CSS إزاحة أفقية، وإزاحة رأسية، ونصف قطر تمويه (blur)، ونصف قطر امتداد (spread)، ولونًا. ويمكن تكديس عدة ظلال للحصول على تأثيرات طبقية. ينتج هذا المولّد البصري الـ CSS لأي تركيبة: مفيد للأزرار والبطاقات وتأثيرات العمق.

الأسئلة الشائعة

كيف أكدّس عدة ظلال؟
افصل بينها بفواصل في قيمة box-shadow. يخلق تكديسها عمقًا أكثر واقعيةً من ظل واحد.
ما الفرق بين التمويه والامتداد؟
يُنعّم التمويه (blur) حواف الظل؛ أما الامتداد (spread) فيوسّع حجم الظل أو يقلّصه قبل تمويهه.

أدوات ذات صلة