Лабораторія тіней

Генератор тіней

Створюйте багатошарові різкі тіні без блюру. Регулюйте зсуви, розтяг і непрозорість — box-shadow оновлюється миттєво.

← На головну

Копіювати CSS тіней

box-shadow: 0px 12px 0px 16px rgba(11, 18, 32, 0.36), inset 0px 0px 0px 3px rgba(168, 85, 247, 0.20);

Стек тіней

Комбінуйте чіткі шари

Використовуйте зсуви для напрямку, розтяг — для товщини, непрозорість — для обʼєму. Додавайте inset‑шари для вирізаних поверхонь.

#1шар
#2шар
Жива тінь

Превʼю різких тіней

Шари зі зміщеннями та розтягом створюють графічну глибину без блюру.

Box-shadow змінюється під час перетягування