SaaS Pricing Cards

Build a complete SaaS pricing section in one component. Includes pricing cards, billing toggle, yearly pricing, savings, feature lists, responsive layouts, and 150+ currencies - all configurable from Framer's Properties panel.

See How It Works

https://youtu.be/ZHIqG0S5M2k?si=vPHXcnQ6QAz7NLzH

Why Buy

Unlike components that only provide cards or toggles, this gives you the entire pricing section in one drop. Everything updates instantly inside the editor—no Preview required.

Features

• Up to 4 pricing plans

• Monthly & yearly billing toggle

• Automatic yearly pricing & savings calculations

• Manual yearly pricing

• Custom price text (Free, Contact Us, etc.)

• Auto-hide CTA for free plans

• Strikethrough original yearly price

• Independent feature lists (50 items per plan)

• 150+ currencies with searchable dropdown

• Editable billing toggle labels

• Native Framer font picker

• Adjustable price size

• Colors, borders, radius & typography controls

• Card shadow controls

• Highlight card scaling

• Responsive desktop & mobile layouts

• Section padding & spacing controls

• Native Framer link picker

• 40+ configurable properties

Version 2.0

A major update based on customer feedback.

New

• Manual yearly pricing

• Custom price text

• Auto-hide CTA for free plans

• Strikethrough original price

• Editable billing toggle labels

• Card shadow controls

• Independent section padding

Improved

• Cleaner yearly pricing display

• Performance improvements, bug fixes, and code cleanup

Includes

• Full TypeScript source code

• 3 pre-built pricing plans

• Fully responsive pricing section

• Future updates included