---
title: "ScrambleCounter — Free Framer component · Best of Framer"
description: "Free Framer component · by Aathif Thajudeen · Interactive. A scramble animated number counter"
canonical: "https://framer.elliotli.dev/component/scramblecounter"
---

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

# ScrambleCounter

A scramble animated number counter

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

![ScrambleCounter preview image 1](https://framer.elliotli.dev/og/component/scramblecounter/3e73c70f1c6b3fcf/1600x1200.jpg)

## Summary

A scramble animated number counter

## Description

Bring your stats to life with a number counter that scrambles through random digits before resolving to the real value — triggered automatically when the component scrolls into view.

**How it works**

When the element enters the viewport, the counter starts from zero and counts up to your target value. Throughout the animation, digits briefly flash as random characters before snapping into place — like a cipher decoding in real time. The scramble effect fades naturally as the number approaches its final value, so the ending always lands clean.

**Features**

-   Scroll-triggered — fires when the component enters the viewport
    
-   Prefix and suffix support — add $, %, +, x, or anything else
    
-   Fully customizable font via Framer's native font picker
    
-   Separate color controls for the number and prefix/suffix
    
-   Adjustable animation duration and delay per instance
    
-   Decimal support for values like 4.2, 98.6, 3.4x
    
-   Animate once or repeat every time the element re-enters view
    

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

-   All · #5247

## Details

- **Author**: Aathif Thajudeen
- **Published**: 2026-06-06
- **Updated**: 2026-06-06
- **Added**: 2026-06-03
- **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