Генератор теней CSS Box-Shadow

Визуальная настройка реалистичных и мягких теней для элементов веб-интерфейса.

Смещение по X (px):

Смещение по Y (px):

Размытие Blur (px):

Растяжение Spread (px):

Прозрачность тени (%):

Результат

box-shadow: 0px 10px 25px -5px rgba(0,0,0,0.15);

Готовый CSS код для вставки в стили

Методология и правила расчета

box-shadow: [offset-x] [offset-y] [blur-radius] [spread-radius] [color];

Свойство CSS box-shadow формирует визуальную глубину (z-index elevation) карточек и кнопок в концепциях Material Design и Modern Clean UI.