Выберите активный слой
Каждая вкладка соответствует одной тени в точном порядке.
Одно проверяемое свойство CSS
Создавайте многослойные box-shadow без ручной переписи CSS
Настройте смещения, размытие, расширение, цвет, непрозрачность и inset, пока браузер показывает точные слои. Скопируйте стабильный CSS: значения не покидают капсулу.
Без аккаунта · сети · 1–8 слоёв · стабильный CSS
Три явных шага
Добавьте, настройте, скопируйте
Настройте явные значения
Смещения, размытие, расширение, цвет, непрозрачность и inset входят в CSS.
Скопируйте одно свойство
Вставьте его в компонент и проверьте границы и состояния фокуса.
Передача разработчику и дизайнеру
Когда визуальной глубине нужен точный CSS
- Настройте сдержанную тень карточки или панели и передайте точный CSS.
- Разделите контактную и окружающую глубину на проверяемые слои.
- Сравните внешнюю и внутреннюю геометрию без ручной переписи.
Локально по архитектуре
Превратите визуальную глубину в точный CSS
Создайте слои, скопируйте свойство и проверьте границы, фокус и совместимость в реальном компоненте.