UTILS.
100% in de browser

CSS Box Shadow Generator

Ontwerp een box-shadow visueel met live voorbeeld en kopieer de CSS.

Over deze tool

Stel visueel een CSS box-shadow samen door met schuifregelaars te spelen met offset, blur, spread, kleur en transparantie, en kopieer vervolgens de kant-en-klare regel. Alles wordt live bijgewerkt en draait volledig in je browser.

Veelgestelde vragen

Wat doet de spread-waarde?
Spread vergroot (positief) of verkleint (negatief) de schaduw voordat er blur wordt toegepast, zodat deze groter of strakker is dan het element.
Wat is een inset-schaduw?
Inset tekent de schaduw binnen het element in plaats van erbuiten, wat handig is voor ingedrukte knoppen of binnenste gloed-effecten.

Meer tools