Генератор CSS Box Shadow
Безкоштовний онлайн генератор CSS box shadow з живим попереднім переглядом. Налаштовуйте зміщення, розмиття, розповсюдження, колір та прозорість.
Shadow List
Generated CSS
Як це працює
- Відкрийте генератор і одразу побачите живий попередній перегляд тіні блоку.
- Налаштуйте горизонтальне та вертикальне зміщення за допомогою повзунків, щоб визначити позицію тіні.
- Встановіть радіус розмиття та розповсюдження, щоб контролювати м'якість і розмір тіні.
- Оберіть колір та непрозорість тіні відповідно до вашого дизайну.
- Скопіюйте згенерований CSS-код і вставте його безпосередньо у ваш файл стилів.
Приклад
Вхід: Горизонтальне: 5px, Вертикальне: 10px, Розмиття: 15px, Розповсюдження: 2px, Колір: #333333, Непрозорість: 0.5
Результат: box-shadow: 5px 10px 15px 2px rgba(51, 51, 51, 0.5);
ЧПЗ
Так, генератор CSS Box Shadow є повністю безкоштовним і не вимагає реєстрації або облікового запису.
Ваші дані є повністю безпечними. Вся обробка відбувається на стороні клієнта у вашому браузері. Жодні дані не надсилаються на жодний сервер.
Так, CSS підтримує кілька значень box-shadow, розділених комами, для створення багатошарових ефектів тіні.
Так, властивість box-shadow підтримується всіма сучасними браузерами без потреби у вендорних префіксах.
Так, додавши ключове слово 'inset' до значення box-shadow, тінь буде застосована всередині елемента, а не зовні.