Генератор CSS Glassmorphism
Создавайте эффекты матового стекла с предпросмотром и CSS-кодом. Тонкая настройка прозрачности, размытия, рамки и тени.
Предпросмотр
Glassmorphism
Предпросмотр
Управление
CSS-код
background: rgba(255, 255, 255, 0.25);
backdrop-filter: blur(10px) saturate(180%);
-webkit-backdrop-filter: blur(10px) saturate(180%);
border: 1px solid rgba(255, 255, 255, 0.18);
border-radius: 16px;Как использовать
Настройте параметры

Настройте прозрачность, размытие и рамку
Предпросмотр

Просматривайте эффект стекла в реальном времени
Скопируйте

Скопируйте CSS-код для использования
Возможности
Управление размытием
Настройка степени размытия backdrop-filter
Настройка фона
Настройка фонового изображения или цвета
Рамка и тень
Настройка рамки и тени в стиле стекла
FAQ
🔗Похожие инструменты
Конвертер цветовых кодов
Конвертация между цветовыми кодами HEX, RGB и HSL. Используйте палитру цветов и предпросмотр в реальном времени для интуитивного выбора цвета.
Палитра цветов
Выбирайте цвета с помощью цветового колеса и ползунков. Получайте и копируйте цветовые коды в форматах HEX, RGB и HSL.
Извлечение цветов из изображения
Автоматическое определение доминирующих цветов изображения и генерация цветовой палитры. Также можно нажать на любую точку изображения для выбора цвета.
Определение среднего цвета изображения
Вычисление среднего цвета всего изображения или выделенной области. Полезно для подбора цветовых схем или фоновых цветов миниатюр.
Генератор CSS-градиентов
Визуально создавайте CSS-градиенты с помощью перетаскивания. Поддержка линейных, радиальных и конических градиентов с предустановками.
Генератор CSS Box Shadow
Визуально создавайте CSS box-shadow с помощью ползунков. Поддержка нескольких теней и внутренних теней.