Animated Corners Btn
Animated corners button for Framer. Hover to reveal full border with smooth animation. Customize text, fonts, colors, padding, border width & cursor styles.
Make it with Workshop
Build your own component with AI
Animated Corner Bracket Button
A sleek, modern button component featuring a unique corner bracket reveal animation.
Features
Stunning Hover Animation
Corner brackets [ ] in default state create a minimalist, sophisticated look
On hover, vertical and horizontal bars smoothly animate away to reveal the full border
Sequential animation timing (vertical bars first, then horizontal) creates a polished, professional effect
Smooth 0.3s ease-in-out transitions for a premium feel
Fully Customizable
Text & Typography: Full Framer font picker with family, weight, and size controls
Colors: Customize text color, border color, and background independently
Spacing: Professional padding control with single or per-side values
Border: Adjustable border width from 1-10px
Cursor: Choose from 12 cursor styles including pointer, grab, zoom, and more
Links: Add URLs with optional new tab opening
Professional Quality
Optimized animations using React state management
Clean, maintainable code structure
Works seamlessly in Framer projects
Simply drag and drop onto your canvas, customize through the properties panel, and watch your design come to life with this premium animated button component.
