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

اضبط معلمات ظل CSS واحصل فورًا على قيمة box-shadow المقابلة، مع معاينة مباشرة. المعالجة محلية 100% في متصفحك (WebAssembly) — لا يُرسل شيء إلى أي خادم.

مثال:

كيف يعمل؟

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

ما الفرق بين التمويه والانتشار؟

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

لماذا تُستخدم خيار "inset"؟

يحول الظل المسقط إلى ظل داخلي يُسقط داخل العنصر، ويُستخدم غالبًا لإعطاء تأثير تجويف أو حقل إدخال.

معالجة محلية 100%: يتم الحساب بالكامل في متصفحك عبر WebAssembly، دون إرسال أي بيانات إلى خادم.