Card Shadow CSS — رمز ظل الصندوق الدقيق
أنشئ تعليمات برمجية لظل مربع CSS بشكل مرئي: أشرطة تمرير للإزاحة والتمويه والانتشار واللون مع العتامة والوضع الداخلي وما يصل إلى أربع طبقات مع معاينة مباشرة.
النتيجة
تفتح هذه الصفحة مولد مربع الظل المُعد مسبقًا لظل بطاقة كلاسيكي: 2 بكسل للأسفل، 8 بكسل تمويه، عتامة سوداء بنسبة 15%. إنها هادئة بشكل متعمد - بما يكفي لفصل البطاقة عن الصفحة دون الإعلان عن نفسها - وتظهر المعاينة مدى الهدوء بالضبط.
يتوافق هذا النطاق مع أدنى خطوات الارتفاع في معظم أنظمة التصميم: بطاقات القائمة، والقوائم المنسدلة، والنوافذ المنبثقة، وصفوف الجدول عند التمرير. إذا كنت بحاجة إلى رفع أقوى للألواح المشروطة أو الألواح العائمة، فارفع إزاحة Y وطمسها معًا - يجب أن تنمو بشكل متناسب للحفاظ على مصدر الضوء معقولًا.
انسخ خط ظل الصندوق إلى أنماط المكونات الخاصة بك، أو قم بتكراره كطبقة ثانية مع تمويه أكثر إحكامًا لإضافة تعريف الحافة. الأداة مجانية وتعمل بالكامل في متصفحك.