Multi Currency Price

The Currency Converter is a powerful Framer code component that lets you display dynamic prices with multi-currency support and real-time switching.Choose a currency and display it consistently across your entire website

It provides two flexible modes:

• A Currency Selector List for switching currencies

• A Live Price Display that converts and formats values instantly

Perfect for eCommerce sites, SaaS landing pages, pricing sections, and international products.

📌 Details

💡 What This Component Does

This component allows you to:

• Display prices in multiple currencies

• Convert values using custom exchange rates

• Switch currencies dynamically without refresh

• Format numbers in different styles (comma, compact, Indian, plain)

• Control decimals and rounding behavior

• Customize UI styling fully inside Framer

It stores selected currency globally using Framer store, so your selection persists across the page.

⚙️ Modes

1. Show List Mode

Displays a selectable list of currencies.

Users can:

• See available currencies

• Click to switch active currency

• Visual indicator shows selected currency

Best for:

• Currency dropdown sections

• Pricing selectors

• E-commerce filters

2. Show Price Mode

Displays converted price based on selected currency.

Features:

• Real-time conversion using exchange rates

• Custom formatting options

• Currency symbol auto-detection

• Smooth UI display

Best for:

• Product pricing

• SaaS pricing pages

• Dynamic landing pages

💱 Currency System

Each currency supports:

• code (USD, EUR, GBP)

• symbol ($, €, £)

• rate (conversion rate relative to base currency)

🎯 Why This Component Is Needed

Most Framer projects lack native multi-currency support, which creates limitations for:

• Global SaaS products

• E-commerce stores

• International landing pages

• Client-based pricing systems

This component solves that by providing:

• No backend required

• No external API dependency

• Fully customizable UI

• Instant currency switching

• Lightweight state management

It helps you build production-ready pricing systems inside Framer without code complexity.

🎛️ Customization Options

You can fully customize:

UI Styling

• Background colors

• Active indicator color

• Text colors

• Font family

• Border radius

• Padding

Price Display

• Font size

• Price color

• Decimal precision

• Formatting style

Currency List

• Dynamic currency array

• Symbol + code + rate control

• Active selection highlight