Docs / Components / Pricing Plan

Pricing Plan

A three-tier pricing card with hover gradient + noise on the price zone, slot-machine price animation via motion/react, and a spring-animated monthly/yearly toggle pill.

Starter
$0/mo

Everything you need to get started with hiring for small teams.

  • Up to 3 active job posts
  • Basic applicant tracking
  • AI applicant screening
  • Email notifications
  • CSV export
  • AI Recruiter agent
  • Custom skill assessments
  • Team collaboration (up to 5)
  • Priority support
  • Advanced analytics
Popular
Professional
$99/mo

Scale your hiring with AI-powered tools built for growing teams.

  • Unlimited active job posts
  • Advanced applicant tracking
  • AI applicant screening
  • Email & Slack notifications
  • CSV & PDF export
  • AI Recruiter agent
  • Custom skill assessments
  • Team collaboration (up to 20)
  • Priority support
  • Advanced analytics
Enterprise
Custom

Custom solutions for large-scale hiring across your organisation.

  • Unlimited active job posts
  • Advanced applicant tracking
  • AI applicant screening
  • Email, Slack & webhook alerts
  • All export formats
  • AI Recruiter agent
  • Custom skill assessments
  • Unlimited team members
  • Dedicated support & SLA
  • Advanced analytics & reports

Dependencies

Install the following dependencies to use this component:

1npm install motion

Installation

Run the following command in your terminal to add the component to your project:

1npx rankflow-ui@latest add pricing-plan

Props Reference

PropTypeDefaultDescription
tiersPricingTier[]TIERSArray of pricing tier objects. Each has name, monthlyPrice, yearlyPrice, description, cta, ctaVariant, features, accentA/B/C colours, and optional popular flag.
classNamestring''Additional CSS classes applied to the wrapper.