其他

glassmorphism

Name: glassmorphism
Author: ainergiz

ainergiz/design…irations

Creates frosted glass UI elements with blur, transparency, and subtle borders. Use when building overlays, floating controls, tooltips, or any element that should appear elevated with a translucent background.

527 次安装
6 星标
收录于 2026.02.21

安装命令

$ npx skills add https://github.com/ainergiz/design-inspirations --skill glassmorphism

SKILL.md

Glassmorphism Pattern

Create frosted glass effects for overlays and floating UI elements.

Core Classes

// Standard glassmorphic container
<div className="bg-black/20 backdrop-blur-md border border-white/10">
  ...
</div>

Variations

Dark Overlay (on images/media)

Best for controls overlaid on images or video.