બોક્સ શેડો જનરેટર

ઑફસેટ, બ્લર, સ્પ્રેડ અને કલર સાથે લેયર્ડ બોક્સ-શેડો ડિઝાઇન કરો. કાર્ડ પર પૂર્વાવલોકન કરો, પછી એક ક્લિકમાં 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

ઑફસેટ, બ્લર, સ્પ્રેડ અને કલર સાથે લેયર્ડ બૉક્સ-શેડો ડિઝાઇન કરો — લાઇવ પ્રિવ્યૂ શામેલ છે.
તમારા બ્રાઉઝરમાં ચાલે છે
વાપરવા માટે મફત

કેવી રીતે ઉપયોગ કરવો

ઑફસેટ, અસ્પષ્ટતા અને ફેલાવાને સમાયોજિત કરો.
રંગ અને અસ્પષ્ટતા પસંદ કરો (અથવા સ્તરો ઉમેરો).
બૉક્સ-શેડો CSS કૉપિ કરો.

How this tool works

ઑફસેટ, અસ્પષ્ટતા અને ફેલાવાને સમાયોજિત કરો.
રંગ અને અસ્પષ્ટતા પસંદ કરો (અથવા સ્તરો ઉમેરો).
બૉક્સ-શેડો CSS કૉપિ કરો.

Recommended settings

પહેલા ડિફૉલ્ટ વિકલ્પોનો ઉપયોગ કરો, પછી જો જરૂરી હોય તો એડજસ્ટ કરો

Supported formats

Text / on-page input

File size and limits

જૂના ફોન પર ખૂબ જ જટિલ મલ્ટિ-લેયર પ્રીવ્યૂ ધીમા લાગે છે.

Privacy

રંગ અને CSS જનરેટર સંપૂર્ણપણે તમારા બ્રાઉઝરમાં ચાલે છે. પૂર્વાવલોકનો અને રૂપાંતરણો ક્યારેય તમારી શૈલીઓ અપલોડ કરતા નથી.

Common use cases

જ્યારે પણ તમને જરૂર હોય ત્યારે બૉક્સ શેડો જનરેટરનો ઉપયોગ કરો: ઑફસેટ, બ્લર, સ્પ્રેડ અને કલર સાથે લેયર્ડ બૉક્સ-શેડો ડિઝાઇન કરો — લાઇવ પ્રિવ્યૂ શામેલ છે.

Troubleshooting

પૂર્વાવલોકન પેસ્ટ કર્યા પછી અલગ દેખાય છે

તમારા પૃષ્ઠ પર સ્પર્ધાત્મક CSS માટે તપાસો (રીસેટ્સ, વારસાગત રંગો). જનરેટ કરેલ નિયમને પહેલા એક અલગ સ્ટાઈલશીટમાં કોપી કરો.

FAQ

શું આ મારું CSS અપલોડ કરે છે?

ના. જનરેટર અને કન્વર્ટર તમારા બ્રાઉઝરમાં લાઈવ પૂર્વાવલોકન સાથે ચાલે છે.

શું મારે એકાઉન્ટની જરૂર છે?

ના. ટૂલ ખોલો, નિયંત્રણોને ટ્વિક કરો અને CSS ની નકલ કરો.