Gradient Button
An easy-to-customize gradient border button for Framer, featuring options to create text, icon, and icon-only buttons in multiple corner styles. Ready to use in your designs.
Make it with Workshop
Build your own component with AI
About this Component
A ready-to-use modern gradient-border button built specifically for Framer. Since Framer doesn’t natively support gradient borders, this component uses a clever layered-frame structure to achieve clean, smooth gradient outlines while keeping everything fully editable.
The options help you create text buttons, left/right icon buttons, both side icon buttons, and icon-only buttons.
This button component will help you in creating multiple border-radius, like:
Fully Rounded
Medium Rounded
Slightly Rounded
and Sharp.
Just copy and drop the gradient border button component into your project. The button is neatly organized and easy to customize with your own text, icons, and colors.
Perfect for anyone who wants polished, modern gradient border buttons without rebuilding the structure from scratch.
