Glassmorphism

Glassmorphism is a design trend which consists on creating blurred transparent cards over different colored elements.

Glassmorphism is a trend feature which is not supported on all browsers, check the browser list to know if it fits your needs.

To create a glassmorphism element, just add the .glassmorphism class to any element.

$10/ month
  • ✓ Pick a background
  • ✓ Add the .glassmorphism class
  • ✓ That's all !
</> Show code

Styling

CSS Variable Default value Description
--ax-glass-background rgba(255, 255, 255, 0.25) Background color.
--ax-glass-blur 5px Blur effect intensity.