ToolKitColor tools
Box Shadow Generator
Preview a single CSS box-shadow derived from a selected color and copy its declaration. Independent offset, blur, spread and layer controls are not available.
Shadow generator
box-shadow
box-shadow: 1px 1px 2px rgb(0 0 0 / .22);
About this tool
Choose a color to change the example shadow: its RGB channel values determine the horizontal offset, vertical offset and blur. Copy the resulting box-shadow declaration for experimentation.
The shadow color is fixed to translucent black. This version does not provide separate offset, blur, spread, inset or layer controls; the color input controls the numeric example rather than the shadow color itself.
Frequently asked questions
Can I adjust separate shadow layers?
No. Only one derived shadow is supported, with no independent layer or spread controls.