સુંદર CSS બોક્સ શેડોઝ સરળતાથી બનાવો
Generate stunning box shadows with our intuitive interface. Copy the CSS code and use it in your projects instantly.
Preview
Box Shadow
Customize me
CSS Output
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
Shadow Controls
Position
Size
Color
Options
Presets
Soft Shadow
Medium Shadow
Heavy Shadow
Inner Shadow
Sharp Diagonal
Outline Glow
Double Shadow
Lifted Effect
How to Use
Basic Controls
- Adjust theHorizontal Offsetto move the shadow left or right
- Adjust theVertical Offsetto move the shadow up or down
- Increase theBlur Radiusto make the shadow softer
- Use Spread Radiusto increase or decrease the overall size of the shadow
- Change theColor and Opacityto customize the shadow appearance
Advanced Features
- Enable Inset Shadowto create an inner shadow effect
- Use Multiple Shadowsfor more complex effects
- Save and loadPresetsfor quick access to your favorite shadows
- Click Random Shadowfor inspiration
- Copy the generated CSS code and paste it into your project
Related Tools
પરફેક્ટ ફ્લેક્સબોક્સ લેઆઉટ બનાવો
Visualize, customize, and generate CSS flexbox code with our intuitive drag-and-drop interface.
CSS બ્યુટીફાયર
Format and beautify your CSS code with professional precision
CSS3 ટ્રાન્ઝિશન જનરેટર
Smooth opacity transition
CPM કેલ્ક્યુલેટર
Calculate Cost Per Mille (CPM) for your advertising campaigns with our easy-to-use calculator.
એનર્જી યુનિટ કન્વર્ઝન
Convert between different units of energy with precision and ease
CSS3 ટ્રાન્સફોર્મ્સને સરળતાથી જનરેટ કરો
A powerful, intuitive tool for creating complex CSS3 transforms without writing code. Visualize changes in real-time and copy the generated CSS to use in your projects.