---
title: "Number Flow — Free Framer component · Best of Framer"
description: "Free Framer component · by RS Studio · Interactive. Details Number Flow Trading is an interactive Framer component for displaying animated prices with corresponding percentage changes."
canonical: "https://framer.elliotli.dev/component/number-flow"
---

[Home](/)/[Components](/components)/[Interactive](/components/category/interactive)/Number Flow

# Number Flow

Animated trading prices with perce

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

![Number Flow preview image 1](https://framer.elliotli.dev/og/component/number-flow/1e7c51fc038f94a4/1600x1200.jpg)

## Summary

Details Number Flow Trading is an interactive Framer component for displaying animated prices with corresponding percentage changes.

## Description

### Details

Number Flow Trading is an interactive Framer component for displaying animated prices with corresponding percentage changes. Each price smoothly transitions between values using Number Flow, while the percentage indicator automatically switches between positive and negative states.

Positive changes display an upward indicator with a green background, while negative changes rotate the indicator and use a red background. The layout animation keeps the price and percentage indicator smoothly aligned as values change.

The component includes a Shuffle button that lets users cycle through multiple configured price and percentage entries. Designers can add their own values and differences directly from the Framer property panel.

The button is also fully customizable, allowing control over its text, visibility, size, spacing, colors, radius, and position.

### Features

-   Animated currency price values
    
-   Percentage difference display
    
-   Positive and negative change states
    
-   Automatic directional arrow animation
    
-   Smooth number transitions
    
-   Multiple price entries
    
-   Interactive Shuffle button
    
-   Custom button styling
    
-   Adjustable price typography
    
-   Configurable spacing and sizing
    
-   Responsive layout
    
-   Number Flow animation
    
-   Motion-based layout transitions
    
-   Currency formatting in USD
    
-   Percentage formatting with up to 2 decimal places
    

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

-   All · #5084

## Details

- **Author**: RS Studio
- **Published**: 2026-08-14
- **Updated**: 2026-08-14
- **Added**: 2026-08-14
- **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