Block Component

SaaS Pricing

Premium SaaS pricing plans, features matrix, and billing frequency toggles with stark Neo-Brutalist design.

Preview

PRICING PLANS

Simple, Unapologetic Pricing

Choose the tier that fuels your app. No hidden fees, cancel anytime you want.

Starter

For builders, side-projects, and early prototypes.

$19/ month

3 active projects
Basic analytics dashboard
10,000 monthly active users
Community slack support
API endpoints access
Custom brand domains

Pro

The sweet spot for growing companies and SaaS products.

$49/ month

Unlimited active projects
Advanced real-time analytics
100,000 monthly active users
Priority 24/7 support email
Full API access
Custom brand domains

Enterprise

Bespoke security, unlimited scaling, and dedicated resources.

$149/ month

Dedicated isolated server cluster
Custom SLAs and data policies
Unlimited active users
Dedicated account success manager
Full API access + custom webhooks
White-label custom portal

No risk guarantee:Try any tier completely free for 14 days. If you are not satisfied, we will issue a full refund within 30 seconds.

Installation

pnpm dlx brutx@latest add saas-pricing

Usage

import { SaaSPricing } from "@/components/ui/saas-pricing"

<SaaSPricing />

const customPlans = [
  {
    name: "Hobby",
    description: "For simple personal projects.",
    priceMonthly: 9,
    priceAnnually: 7,
    buttonText: "Start Hobby Plan",
    buttonVariant: "outline" as const,
    features: [
      { text: "1 active project", included: true },
      { text: "Basic support", included: true },
      { text: "Custom domains", included: false }
    ]
  },
  {
    name: "Growth",
    description: "For commercial operations and scaling teams.",
    priceMonthly: 29,
    priceAnnually: 23,
    popular: true,
    buttonText: "Upgrade to Growth",
    buttonVariant: "primary" as const,
    features: [
      { text: "Unlimited projects", included: true },
      { text: "Priority support", included: true },
      { text: "Custom domains", included: true }
    ]
  }
];

<SaaSPricing
  plans={customPlans}
  title="Choose Your Power"
  subtitle="Start scaling with Neo-Brutalist confidence today."
/>