Skip to content

component

Shiny Glass Button

By Jan van der Horst

Details

Summary

Shiny Glass Button - a meticulously crafted component designed to bring a premium, tactile feel to your Framer projects.

Description

Shiny Glass Button This is the high-fidelity Shiny Glass Button - a meticulously crafted component designed to bring a premium, tactile feel to your Framer projects. While most glassmorphism buttons feel flat, this one uses dynamic layering and physics-based interactions to create a truly "clickable" experience. Key Features Sleek Glint Animation: A realistic light sweep/glint moves across the surface of the button on hover, mimicking how light hits real glass. Intensifying Background Blur: Using advanced backdrop filters, the background blur depth increases dynamically when hovered, making the button "pop" against your content. Realistic Expanding Shadows: Instead of a simple drop shadow, this component features multi-layered, soft shadows that expand and soften as you hover, simulating physical lift. Micro-Scale Feedback: A smooth, spring-animated scale-up effect provides instant visual confirmation for the user. Endless Customization This component is built to be flexible. You don't need to touch a single line of code to make it yours: Typography: Change the label, font family, weight, and size directly in the Framer properties panel. Colour Palette: Fully customizable glass tint, border colors, and text colors to match your brand's DNA. Blur & Transparency: Dial the "frosted" look up or down by adjusting the background opacity and/or BG Blur level. Corner Radius: Go from a sharp, modern rectangle to a soft, pill-shaped button in seconds.

Introduction

Free Shiny Glass Button with Hover FX

Rank history

Daily rank per list, from the first snapshot — lower is better.

12001400143938/148/228/309/79/15
  • All · #4269