→ كل أدوات النصوص

مولد ظل الصندوق CSS

صمم ظلال الصناديق بالمنزلقات مع معاينة مباشرة، ثم انسخ كود CSS.

  • مجاني
  • بلا تسجيل
  • يعمل على أي جهاز

حول مولد ظل الصندوق CSS

اضبط الإزاحة والضبابية والانتشار واللون والشفافية على معاينة مباشرة وانسخ تصريح box-shadow. القيم هي الإزاحة x والإزاحة y ونصف قطر الضبابية ونصف قطر الانتشار واللون، بهذا الترتيب. أضف inset لرسم الظل داخل الصندوق، وأبقِ الشفافية منخفضة للحصول على نتائج طبيعية.

طريقة استخدام مولد ظل الصندوق CSS

  1. حرّك أشرطة الإزاحة والتمويه والانتشار والشفافية.
  2. اختر لون الظل وراقب المعاينة المباشرة.
  3. انسخ box-shadow CSS إلى ورقة أنماطك.

لماذا تستخدم هذه الأداة؟

تُعرف أيضًا باسم

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

ماذا تفعل قيمة الانتشار (spread) في box-shadow؟

يكبّر الانتشار الظل أو يصغّره قبل تطبيق الضبابية. الرقم الموجب يجعله أكبر من الصندوق والسالب يجعله أصغر، وهذا مفيد للظلال على جانب واحد فقط.

كيف أضيف أكثر من ظل؟

يسمح CSS بعدة ظلال مفصولة بفواصل. ابنِ كلًّا منها، ثم ادمجها في سطر box-shadow واحد للحصول على عمق أنعم وأكثر واقعية.

ماذا يفعل خيار inset؟

يرسم inset الظل داخل الصندوق بدل خارجه. مفيد للأزرار المضغوطة وحقول الإدخال واللوحات الغائرة.

هل مولد ظل الصندوق CSS مجانية؟

نعم. استخدام مولد ظل الصندوق CSS على Toolipedia مجاني، بلا تسجيل وبلا علامة مائية.

هل استخدامها آمن؟

نعم. تتم كل العمليات الحسابية في متصفحك، ولا يُرسَل أي شيء تُدخله إلى خادمنا.

هل تعمل على هاتفي؟

نعم. تعمل في أي متصفح حديث على Android وiPhone، وكذلك على الأجهزة اللوحية والحواسيب. لا حاجة إلى تثبيت أي شيء.

هل أحتاج إلى حساب؟

لا. افتح الصفحة واستخدم الأداة فحسب. لا تسجيل ولا حاجة إلى بريد إلكتروني.

هل يمكنني وضع مولد ظل الصندوق CSS في موقعي؟

نعم. استخدم زر «ضمّن الأداة في موقعك» أسفل الأداة لنسخ مقطع قصير من الشيفرة ولصقه في صفحتك. الخدمة مجانية، ولا تحتاج إلى حساب، وتبقى الأداة تعمل داخل صفحتك.

أدوات ذات صلة