Дизайн
Генератор тіней CSS Box Shadow
Дизайн тіней блоків візуально.
Як використовувати
Почніть з пресету або одного шару, потім додайте шари для глибини. Перемикайте inset для натиснутих/neumorphic ефектів. Скопіюйте значення через кому у box-shadow.
Поширені запитання
Чи можна накласти кілька тіней?
Так — додавайте шари, щоб поєднати м’яку розсіяну тінь із чіткою контактною або накласти кольорові світіння. Кожен шар має власні зміщення, розмиття, розширення, колір і перемикач inset.
Що роблять пресети?
Стартові варіанти в один клік: піднята картка в стилі Stripe, опуклий і втиснутий неоморфізм, матеріальна глибина та м’яке світіння — після застосування налаштуйте повзунки.
Як використовувати результат?
Скопіюйте рядок box-shadow у свій CSS. Кілька шарів відокремлюються комами саме так, як очікують браузери.
Останнє оновлення: