جعبه سایه ژنراتور

باکس-سایه های لایه لایه با افست، تاری، گسترش و رنگ طراحی کنید. پیش نمایش را روی یک کارت مشاهده کنید، سپس CSS را با یک کلیک کپی کنید.

Box Shadow Generator

Live

Offset X8px

Offset Y16px

Blur32px

Spread-4px

Opacity35%

Card radius24px

Shadow color

Inset

Preview card

CSS output

box-shadow: 8px 16px 32px -4px rgba(192, 38, 211, 0.35);
border-radius: 24px;

Key capabilities

طراحی کادر سایه‌های لایه‌ای با افست، تاری، گسترش و رنگ - شامل پیش‌نمایش زنده.
در مرورگر شما اجرا می شود
رایگان برای استفاده

How to use

تنظیم افست، تاری، و گسترش.
رنگ و کدورت را انتخاب کنید (یا لایه ها را اضافه کنید).
CSS باکس سایه را کپی کنید.

How this tool works

تنظیم افست، تاری، و گسترش.
رنگ و کدورت را انتخاب کنید (یا لایه ها را اضافه کنید).
CSS باکس سایه را کپی کنید.

Recommended settings

ابتدا از گزینه های پیش فرض استفاده کنید، سپس در صورت نیاز تنظیم کنید

Supported formats

Text / on-page input

File size and limits

پیش‌نمایش‌های چندلایه بسیار پیچیده ممکن است در تلفن‌های قدیمی‌تر کندتر به نظر برسد.

Privacy

ژنراتورهای رنگ و CSS به طور کامل در مرورگر شما اجرا می شوند. پیش نمایش ها و تبدیل ها هرگز سبک های شما را آپلود نمی کنند.

Common use cases

هر زمان که نیاز دارید از Box Shadow Generator استفاده کنید: سایه‌های جعبه لایه‌ای با افست، تاری، گسترش و رنگ طراحی کنید - شامل پیش‌نمایش زنده.

Troubleshooting

پیش نمایش بعد از چسباندن متفاوت به نظر می رسد

CSS رقیب را در صفحه خود بررسی کنید (بازنشانی، رنگ های ارثی). ابتدا قانون تولید شده را در یک stylesheet ایزوله کپی کنید.

FAQ

آیا این CSS من را آپلود می کند؟

خیر. ژنراتورها و مبدل ها در مرورگر شما با پیش نمایش زنده اجرا می شوند.

آیا به یک حساب کاربری نیاز دارم؟

نه. ابزار را باز کنید، کنترل ها را تغییر دهید و CSS را کپی کنید.