🪟 Один набор инструментов для
любой задачи проектирования

Генератор глассморфизма

Создавайте матовые стеклянные карточки с размытием фона, прозрачностью и тонкими рамками. Предпросмотр в реальном времени и готовый CSS.

English 中文 日本語 한국어 Español Português Français Deutsch العربية हिन्दी ไทย Tiếng Việt Bahasa Русский

🪟 Генератор глассморфизма

Гид по глассморфизму

Глассморфизм — это стиль UI-дизайна с эффектом матового стекла: полупрозрачные слои, размытие фона и тонкие границы, сквозь которые просвечивают цвета фона. Популяризирован Apple и Microsoft, сегодня это стандартный приём современного интерфейсного дизайна.

Настройте радиус размытия, прозрачность белого, толщину рамки и скругление углов, чтобы создать свою стеклянную карточку. Предпросмотр показывает реалистичную матовую панель поверх цветного фона, а CSS включает префикс -webkit- для совместимости с Safari.

Pro Tips

Frequently Asked Questions

Q: Что такое backdrop-filter?
Что такое backdrop-filter? Он применяет визуальные эффекты (например, размытие) ко всему, что находится ЗА элементом. В отличие от filter, который воздействует на сам элемент, backdrop-filter размывает только фон, оставляя стеклянный слой чётким.
Q: Работает ли глассморфизм во всех браузерах?
Работает ли глассморфизм во всех браузерах? Все современные браузеры поддерживают backdrop-filter. Safari требуется префикс -webkit-backdrop-filter, который автоматически включается в сгенерированный CSS.
Q: Глассморфизм всё ещё в тренде в 2026 году?
Глассморфизм всё ещё в тренде в 2026 году? Да. Он превратился из тренда в устоявшийся язык дизайна, который используют Apple, Microsoft и крупные финтех-приложения вроде Revolut и N26.
Q: Какой фон лучше всего подходит для стеклянных карточек?
Какой фон лучше всего подходит для стеклянных карточек? Яркие градиенты — фиолетовые, синие, розовые или бирюзовые. Фон должен быть достаточно цветным, чтобы просвечивать сквозь матовый слой.
Q: Влияет ли backdrop-filter на производительность?
Влияет ли backdrop-filter на производительность? Несколько стеклянных элементов почти не сказываются. Десятки вложенных backdrop-filter могут замедлить прокрутку на слабых устройствах — используйте их только на ключевых поверхностях.

Русские традиционные цвета

От гжельской синевы до хохломского золота — русская палитра рождена народными промыслами, иконописью и северной природой. Эти цвета до сих пор вдохновляют дизайнеров по всему миру.

Алый #FF2400

Алый цвет знамён, сарафанов и праздничной символики

Васильковый #6495ED

Цвет полевых васильков — символ русских лугов

Золото Хохломы #D4AF37

Золотой орнамент хохломской росписи

Гжель Синий #005A9C

Кобальтовая синева гжельской керамики

Изумрудный #50C878

Цвет уральских самоцветов и малахита

Бордовый #800020

Тёмно-красный цвет театральных занавесов

Янтарный #FFBF00

Балтийский янтарь — золото Калининграда

Сиреневый #C8A2C8

Нежная сирень майских садов

Охристый #CC7722

Цвет иконописи и древних фресок

Снежно-белый #F8F8FF

Белый снег русских зим

Q: Что такое гжель?
Что такое гжель? Гжель (#005A9C) — традиционная русская керамика с синей кобальтовой росписью на белом фоне, производимая в Подмосковье с XVIII века и ставшая символом русского народного искусства.
Q: Что такое хохлома?
Что такое хохлома? Хохлома — традиционная деревянная роспись с золотым орнаментом (#D4AF37) на чёрном или красном фоне, создаваемая в Нижегородской области с XVII века.