PricingCard

Show Preview
PricingCard
PricingCard

About PricingCard

What it does

  • Runs slider — visitors pick their tier (10K, 25K, 100K, 500K runs, or whatever you define) and the price snaps to it

  • Per-model add-on pricing — charge a base price + €X per enabled model. Toggle models on, price goes up. Toggle off, price drops. Live

  • Four pricing modes in one component — Standard (fixed tiers + optional model add-ons), Free, Custom ("Talk to sales"), and Configurable (live-calculated base + multiplier)

  • Monthly / Annual toggle — syncs across every card on the page. Click Annual on one card, all of them switch

  • Explicit currency and locale — set Currency to USD, EUR, or Custom (with your own symbol field for £, ¥, CHF, kr), and Locale to control number grouping (en-US for 1,000, de-DE for 1.000). Pulls from USD or EUR price fields in your tier array. No detection, no network requests — fully deterministic

  • Savings badge — shows "Save 20%" on annual automatically

  • Model selection cap — set "Max Selectable" to 2 on your Free tier, leave it at 0 (unlimited) on Pro. When the cap is reached, selecting another model swaps out the oldest

From Francisc Toth

AuthCard
Instagram Video Card
Team Card Flip
Dial Carousel

Related Components

Fan Deck
Keepsake Folder
Pixel Hover Card
Path Steps