---
title: "Circle to fill CTA — Framer component · Best of Framer"
description: "$3.00 · Framer component · by Ravi Madhusanka · Buttons. Circle CTA expands into Filled on hover"
canonical: "https://framer.elliotli.dev/component/circle-to-fill-cta"
---

[Home](/)/[Components](/components)/[Buttons](/components/category/buttons)/Circle to fill CTA

# Circle to fill CTA

Circle CTA expands into Filled on hover

[View on Framer](https://framer.com/marketplace/components/circle-to-fill-cta/?via=elliot-li)

![Circle to fill CTA preview image 1](https://framer.elliotli.dev/og/component/circle-to-fill-cta/48d58952f89d383a/1600x1200.jpg)

## Summary

Circle CTA expands into Filled on hover

## Description

## Circle Expand Button

A sleek animated call-to-action component built for designers and creators who want to elevate micro-interactions with minimal effort. It begins as a compact circular icon and smoothly expands into a fully revealed CTA — blending function with visual delight.

### Features

-   **Circle-to-Pill Expansion**
    
    Seamlessly transforms from a minimal circular button into a rounded pill CTA on hover.
    
-   **Smooth Morph Animation**
    
    Fluid shape and width transition for a polished, premium feel.
    
-   **Fully Customizable**
    
    Easily adjust text, icon, colors, hover fill, border, radius, and animation speed.
    
-   **Interaction-First Design**
    
    Adds meaningful motion without overwhelming your UI.
    
-   **Responsive & Drop-In Ready**
    
    Optimized to work across hero sections, cards, sliders, and navigation areas.
    

## Rank history [How rankings work →](/terms#rankings)

-   All · #9663

## Details

- **Author**: Ravi Madhusanka
- **Price**: $3.00
- **Published**: 2026-03-02
- **Updated**: 2026-03-02
- **Added**: 2026-02-23
- **Categories**: Buttons

## More like this

-   [Eye Glow Button](/component/eye-glow-button) — Frame Native · Free — Cursor-following eyes, soft glow
-   [Dash Stretch Button](/component/dash-stretch-button) — Pentaclay · Free — Animated Hover Button With a Dash
-   [Nova Theme Toggle](/component/nova-theme-toggle) — Shouvik Biswas · $12 — Three-Mode Theme Toggle
-   [Nabby: Copy Button](/component/nabby-copy-button) — Francesco Gallo · Free — Plug in your button, copy anything