Skip to the content

Library/ 26 glass-buttonProButtons

Glass Button

A glass button that blurs and bends what lies behind it.

A Pro component: the live demo and the code come with Pro.

Settings

Pro
  • refraction
  • bezel
  • blur
  • press
Tune it live with Pro

What it does

Glass Button is an animated button ready for your AI assistant, React or plain JavaScript, with no dependencies. Also called liquid glass, glass surface or glassmorphism.

The button looks cut from thick glass: the page behind it turns soft, and warps near its rounded edges like a lens. A light sheen trails the mouse and the button sinks a touch when pressed. Text stays a real, focusable button.

With Pro

The AI prompt, the React component, the plain JavaScript file and the embed come with Pro, along with the live demo. Every setting is optional: with none, you get the effect as the preview shows it.