Tink, the Tinkkit robotTinkkit
← All toolsDeveloper›Web & CSS

CSS Box Shadow & Gradient Generator

Build CSS box shadows and linear gradients with sliders and a live preview, then copy the CSS.

Tip from Tink: Soft shadows look best with low opacity and a large blur.

box-shadow: 0px 12px 32px -8px rgba(0, 0, 0, 0.25);
Advertisement

How to use the CSS Box Shadow & Gradient Generator

  1. Pick Shadow or Gradient.
  2. Move the sliders and pick colors.
  3. Copy the CSS line.

Everything runs in your browser. Nothing you enter is uploaded.