Glass Effect CSS Generator
Generate CSS for glassmorphism effects with backdrop blur, transparency, and borders.
px
px
Result
CSS Code
background: rgba(255, 255, 255, 0.15);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 16px;Tailwind Classes
bg-[rgba(255,255,255,0.15)] backdrop-blur-[12px] border border-[rgba(255,255,255,0.2)] rounded-[16px]