Генератор Box Shadow
Бесплатный онлайн генератор CSS box-shadow, предпросмотр в реальном времени
Синтаксис CSS box-shadow
box-shadow: [inset] offset-x offset-y blur spread color. Несколько теней разделяются запятыми. Визуальный редактор позволяет настраивать значения в реальном времени.
Как использовать генератор теней
Регулируйте слайдеры: смещение X, Y, размытие, растяжение. Выберите цвет и переключите inset. CSS-код обновляется мгновенно.
▶Разница между blur и spread?
Blur — мягкость краёв тени (0 = резкий край). Spread — расширение/сжатие тени во всех направлениях.
▶Можно ли добавить несколько теней?
Да, через запятую: box-shadow: 0 2px 4px rgba(0,0,0,0.1), 0 8px 16px rgba(0,0,0,0.1);.
▶Что делает inset-тень?
Тень внутри элемента вместо внешней. Создаёт эффект вдавленности, как у текстового поля.