أفضل مجاني مولد ظلال صناديق CSS
بناء بصري CSS box-shadow مع العرض المسبق الحي، وطبقة ثانية - نسخ الرمز.
مجاني 100 في المائة
لا يوجد
لا يوجد علامة مائية
الملفات المجهزة في الذاكرة، ولم تخزن أبدا
✨
Go Pro لأفضل نماذج الذكاء الاصطناعي - الصورة، والفيديو والدردشة - بالإضافة إلى تحميل أكبر، الأولوية في الصف ودون انتظار.
ترقية إلى Pro
الحب best.free? شاركها
كيف يعمل
- تحرك المُضلّل. حدد التحول، الغموض، الانتشار، اللون والانعكاس؛ حدد أو أزل الظل إذا كنت تريد ظلاً داخلياً.
- شاهد العرض الأولي. يحدث المربع الحي عندما تسحبه؛ أضف طبقة ثانية في الخيارات المتقدمة للعمق.
- نسخة من CSS. اضغط على نسخ CSS ولصق قاعدة ظل الصندوق مباشرة في ورقة أسلوبك.
عن هذه الأداة
تصميم ظل مربع بدون تخمين قيم البكسل. سحب التحول X، التحول Y، وعدم الوضوح والانتشار المزلقة، واختيار لون الظل واختيار انعدام الشفافية، ومشاهدة تحديث مربع العرض المسبق الحي في الوقت الحقيقي - ثم نسخ CSS ظل مربع دقيق. قلب التبديل في الداخل لظل داخلي. الخيارات المتقدمة تراكم طبقة ظل ثانية، بحيث يمكنك بناء ظلال ناعمة متعددة الطبقات المستخدمة في البطاقات والأزرار الحديثة. كل شيء يعمل في متصفحك.
ما الذي يستخدمه الناس
- أضف ظلاً خفيفاً إلى البطاقات والطرائق
- إنشاء ظل داخلي (مدخل) للمدخلات والآبار
- تراكم طبقتين لظل واقعي، غير متجانس
- حدد التحول والغموض لمطابقة نموذج تصميم
الأسئلة المتكررة
تحرك حركة الظل الأفقي والعمودي، وتحريك الظل الغامق حافة الظل، وتوسيع أو تقليص الظل بأكمله قبل تطبيق الظل الغامق. تظهر العرض المسبق الحي كل تغيير فورا.
إن خيار "Inset" يرسم الظل داخل العنصر بدلاً من خلفه، مما يعطي مظهراً شبه مضغوط - مفيد للمدخلات والتبديلات. قم بقلب خيار "Inset" للتبديل.
اختار لوناً، ثم استخدم مُسلّط الانعكاس؛ وتخرج الأداة قيمة rgba () بحيث يختلط الظل بشكل طبيعي.
نعم. افتح الخيارات المتقدمة لتمكين طبقة ظل ثانية مع تحولها الخاص، وعدم الوضوح، واللون، والإدخال.
لا. يعمل المولد بالكامل في متصفحك؛ فالمصباحات تحسب فقط سلسلة CSS محلياً.
مجاني تماما، لا حساب ولا حدود - أداة جانب العميل مع لا شيء لقياس.
نعم، فهو يعمل في متصفحك، لذا يعمل مولد ظل صندوق CSS على الهواتف واللوحات بالإضافة إلى سطح المكتب - لا يوجد تطبيق لتثبيته.
عادةً ما يستغرق الأمر بضعة ثوانٍ فقط للملف النموذجي - يبدأ مولد CSS Box Shadow Generator العمل في اللحظة التي تعطيه فيها مدخلاتك.
الاستخدام العرضي غير محدود، تحت سقف سخي للاستخدام العادل يجعله سريعاً للجميع.
جميع المتصفحات الحديثة - كروم، سافاري، فايرفوكس وإدج. CSS Box Shadow Generator لا يحتاج إلى أي شيء منشأة خارج المتصفح الذي تستخدمه بالفعل.