Pricing Section

A ready-to-use pricing section component built for easy customization. Modify plans, features, and styles directly in code to match your product or brand.

Simple, scalable pricing

Choose a plan that fits your design system and scaling needs.

Free plan

$0

Perfect for small teams exploring ZentoUI components.

  • ✓ Access to core components
  • ✓ Community support
  • ✓ Up to 5 custom themes
  • ✓ Basic motion utilities

Startup

$49

Ideal for teams building production-grade UI at scale.

  • ✓ Access to all components
  • ✓ Priority email support
  • ✓ 100+ theme presets
  • ✓ Advanced animation utilities

Enterprise

Custom

For large orgs looking for full customization and white-labeling.

  • ✓ Custom component theming
  • ✓ Custom licensing
  • ✓ Slack & SSO integration
  • ✓ Design system consultation

How to use this component

  1. Copy the component: Copy the PricingSection component and place it in your project’s components/ folder.
  2. Import & use it: Wherever you want to show the pricing section, import and render it like this:
    import PricingSection from "@/components/PricingSection";
    
    export default function Page() {
      return (
        <main>
          <PricingSection />
        </main>
      );
    }
  3. Customize if needed: You can tweak the text, plans, features, or button styles directly in the component to match your needs.