Генератор CSS box-shadow
Соберите CSS box-shadow ползунками смещения, размытия, растяжения, цвета и прозрачности, посмотрите вживую на образце и скопируйте готовый CSS.
Как пользоваться
Двигайте ползунки смещения по X/Y, размытия и растяжения, выберите цвет и прозрачность, включите «inset» для внутренней тени. Предпросмотр обновляется вживую.
Когда нравится — скопируйте строку box-shadow прямо в стиль. Это стандартный CSS, работает во всех современных браузерах.
Частые вопросы
Что делают смещение, размытие и растяжение?
Смещение двигает тень по горизонтали и вертикали, размытие смягчает края, растяжение увеличивает или уменьшает тень до размытия.
Что такое inset?
Рисует тень внутри элемента, а не снаружи — эффект внутренней/вдавленной тени.
Можно несколько теней?
Инструмент собирает одну; несколько можно объединить через запятую в CSS.
Везде работает?
Да — box-shadow поддерживается всеми современными браузерами без префиксов.