Modular Pricing Calc

Interactive calculator. RTL ready. No co

Build any pricing section in minutes. Modular Pricing Calculator is a fully interactive component that lets your site visitors configure their own plan — and watch the total update in real time. What it does Add as many rows as you need. Each row can be a Toggle, Checkbox, or Stepper — and every interaction instantly recalculates the total price with a smooth animated number transition. Toggle perfect for billing period switches (e.g. monthly → annual with a discount multiplier) Checkbox add-on features with a fixed price or percentage discount Stepper seat or quantity-based pricing with configurable Min and Max limits What makes it different → Animated total the price morphs smoothly on every interaction, not an instant swap→ Savings badge automatically shows monthly and yearly savings when a discount row is active→ Price breakdown tooltip hover the total to see a full itemized breakdown of every selection→ RTL / Arabic ready switch direction to RTL from the properties panel; all layouts, labels, and savings copy flip automatically. Supports Arabic, Farsi, and all right-to-left languages→ 6 currencies USD, EUR, GBP, EGP, SAR, AED each formatted with the correct locale and symbol→ CTA button built in configure label, URL, color, and radius directly from the panel. Background auto-inherits the accent color Fully styled from the panel Every visual detail is exposed as a property — card background, border, radius, shadows, fonts, label sizes, accent color, stepper button style, badge colors, tooltip style, and CTA — no code required to match your brand. Properties Base Price, Currency (6 options), Direction (LTR / RTL), Billing Label Rows (Array) — unlimited Toggle / Checkbox / Stepper rows, draggable to reorder Card Style — background, border, radius, padding, shadow, divider Typography — body font, label size, label color, muted color, price font, price size Colors — accent (applies to toggles, checkboxes, steppers, and CTA) Controls Style — row background, checkbox box style, stepper button style Badges & Tooltip — savings badge and breakdown tooltip colors and radius CTA Button — label, URL, new tab, background, text color, radius, padding, font size Breakdown toggle, Savings badge toggle Use it forSaaS pricing pages, subscription configurators, service quote builders, agency project estimators, and any page where price depends on user choices.

Interactive calculator. RTL ready. No co