Dev Patrache

Генератор CSS box-shadow

box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.15);
Drop Shadow
Последнее обновление: 2026 · Бесплатный онлайн-инструмент

Что такое Генератор CSS box-shadow?

Бесплатный онлайн визуальный редактор для создания CSS box-shadow и копирования кода

Как использовать

  1. 1
    Выберите пресет — Быстро начните с кнопки пресета.
  2. 2
    Настройте ползунки — Настройте тень с помощью ползунков смещения X/Y, размытия и распространения.
  3. 3
    Предпросмотр — Проверьте результат в реальном времени в предпросмотре выше.
  4. 4
    Скопируйте CSS — Используйте кнопку копирования для получения CSS box-shadow.

Связанные инструменты

Часто задаваемые вопросы

Да, используйте кнопку «Добавить тень» для наложения нескольких теней.

Да, включите флажок Inset для каждой тени, чтобы создать внутреннюю тень.

Предоставляется пять пресетов: Subtle, Medium, Large, Inset и Double.

Да, вы можете ввести rgba(0,0,0,0.15) непосредственно в поле цвета.

Нет. Все вычисления выполняются в браузере.

Этот сайт использует файлы cookie для улучшения опыта и рекламы. Подробнее