PriceGrid

Boost your SaaS conversions

PriceGrid gives you a polished, conversion-ready pricing section in minutes. Add as many plans as you need, write your features, pick your colors — the layout, spacing, and price sizing adapt automatically to any container width.

Key Features:

• A built-in Monthly/Yearly switch updates prices instantly. No complex component variants or variables required.

• Subscription and fixed price options. Price ranges.

• Choose how prices transition: Count Up, Scale, Fade, or None. Powered by framer-motion for buttery smooth performance.

• Automatically scales and highlights your preferred plan with a custom badge and border to drive focus to your main tier.

• Match your brand instantly. Customize primary colors, backgrounds, fonts, and button styles directly from the property panel.

• The grid automatically adapts from a clean multi-column layout on desktop to a stacked, touch-friendly layout on mobile.

• 100% client-side and privacy-friendly. Works instantly on any static host, with no setup or third-party services.

• Accessibility built in. Respects your visitor's "Reduce motion" setting and disables non-essential animation automatically.

Perfect for:

• SaaS Landing Pages

• Membership Sites

• Online Courses

• Agency Service Packages

How to use: Simply drag PriceGrid onto your canvas. Edit your plans, prices, and features in the sidebar list. The component handles all the responsiveness and interaction logic automatically. No coding required.