---
title: "ProgressBarr — Framer component · Best of Framer"
description: "$2.00 · Framer component · by Ux Prex · Interactive. Animated Circle Progress Bar"
canonical: "https://framer.elliotli.dev/component/progressbarr"
---

[Home](/)/[Components](/components)/[Interactive](/components/category/interactive)/ProgressBarr

# ProgressBarr

Animated Circle Progress Bar

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

![ProgressBarr preview image 1](https://framer.elliotli.dev/og/component/progressbarr/5e152246552c8659/1600x1200.jpg)

## Summary

Animated Circle Progress Bar

## Description

### Detailed Description:

Elevate your web projects with this professional Circle Progress Bar component. Built with performance and aesthetics in mind, it features smooth Ease-Out Expo animations and offers complete control over every visual element. Whether you need to show skill levels, project completion, or financial statistics, this component adapts to your design perfectly.

### Key Features:

-   **Smooth Easing:** Powered by a premium Ease-Out Expo animation for a high-end feel.
    
-   **Extended Typography:** Full control over font size, weight, and spacing for both the counter and label.
    
-   **Dual Width Control:** Customize the progress bar and background track thickness independently.
    
-   **Directional Control:** Supports both Clockwise and Counter-clockwise animations.
    
-   **Flexible Formatting:** Easily add custom prefixes (e.g., $), suffixes (e.g., %), and set decimal points.
    
-   **Fully Responsive:** Perfectly scales within any container without losing quality.
    
-   **Appear Animation:** Triggers beautifully as soon as it enters the user's viewport.
    

### Property Controls (For Documentation):

-   **Number & Percent:** Set the target value and the visual fill percentage.
    
-   **Bar & Track Color:** Complete color customization to match your brand.
    
-   **Start Angle:** Choose where the animation begins (e.g., top, bottom, or side).
    
-   **Label Support:** Optional secondary text for context (e.g., "Success Rate").
    

## 🏷️ Tags (Search Keywords):

Circle Progress, Animated Loader, Data Visualization, Dashboard UI, Progress Indicator, Framer Component, SVG Animation.

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

-   All · #4137

## Details

- **Author**: Ux Prex
- **Price**: $2.00
- **Published**: 2026-05-12
- **Updated**: 2026-08-02
- **Added**: 2026-05-06
- **Categories**: Interactive

## More like this

-   [Velvet Curtain](/component/velvet-curtain) — Sarthak Prakash · $12 — Cinematic curtain reveal effect
-   [Image-Compare Slider](/component/image-compare-slider) — Studio Digital · Free — Reveal what changed, beautifully
-   [Lesson Packages](/component/lesson-packages) — Shelfless Studio · $9 — Lesson bundles with savings shown
-   [Deskbell AI Chatbot](/component/deskbell-ai-chatbot) — NS. Studio · Free — AI site chat, works with Chatbase