PaceUI

  • Components
  • Blocks
  • Templates
  • Studio
  • Resources
Intro
  • Components
  • Installation
  • MCP
Agents
  • Chat Composer
  • Workflow Board
  • Thinking States
  • Audio Visualizer
  • Task Pipeline
  • Approval Card
  • Model Ability Selector
  • Model Selector
  • Response Writer
  • AI Suggestions
  • Token Counter
Crafts
  • All Crafts
  • Avatar Flight
  • Voice Record
  • Starfield Card
  • Destination Queue
  • Rolling Bento
  • Download Button
  • Cart Stepper
  • Heart Burst
  • Copy Bar
  • Generative Grid
  • Destination Card
  • Magnetic Button
  • Morphing Copy
  • Expanding Search
  • Metric Tracker
  • Tilt Card
  • Animated Stack
Charts
  • API Traffic
  • Weekly Traffic
  • Financial Performance
  • Channel Sales
  • Customer Growth
  • Customer Segments
  • Sales Overview
  • Traffic Distribution
  • Daily Orders
  • Acquisition Funnel
  • Weekly Attendance
  • Market Trends
  • Portfolio Overview
  • Instance Health
  • Resource Usage
  • SaaS Subscriptions
  • Database Performance
  • Model Usage
  • Spend Allocation
Motion
  • Accordion
  • Alert
  • Calendar
  • Checkbox
  • Collapsible
  • Combobox
  • Context Menu
  • Dropdown Menu
  • Empty
  • Hover Card
  • Input OTP
  • Menubar
  • Navigation Menu
  • Pagination
  • Progress
  • Radio Group
  • Scroll Area
  • Select
  • Sidebar
  • Slider
  • Switch
  • Tabs
  • Tooltip
  • Reveal Text
  • Scramble Text
  • Squash Text
  • Bouncing Text
  • Mouse Wave Text
  • Text Fall Button
  • Spring Button
  • Infinite Scroller
  • Fillable Button
  • Layered Stack
  • Gradient Shadow
  • Profile Peek
  • Flip Reveal
  • Reveal on Scroll
  • Swap
  1. Components
  2. Charts
PreviousNext

SaaS Subscriptions

A high-density SaaS subscription stacked bar chart with compact card size and custom data list breakdown.

When to use

  • Compact SaaS subscription breakdown tracking Monthly Active Subscriptions across tiers (Basic, Pro, Enterprise).
  • Stacked bar charts with compact card dimensions and custom itemized status list.
  • Billing portals, developer platforms, and SaaS founder analytics dashboards.

When not to use

  • Granular raw event logs without plan aggregation.
  • Non-subscription business models (e.g., ad-supported or one-off transactions).

Props

PropTypeDefaultDescription
dataSaasSubscriptionDataPoint[]defaultChartDataArray of monthly subscription count data points across tiers.
metricsSaasSubscriptionMetric[]defaultMetricsSummary metrics displayed below the chart.
classNamestring—Optional custom CSS classes for the card container.

Data Structure

FieldTypeDescription
monthstringMonth label along the horizontal axis (e.g., Jan, Feb).
basicnumberActive subscription volume for the Basic tier.
teamnumberActive subscription volume for the Team tier.
scalenumberActive subscription volume for the Scale tier.
enterprisenumberActive subscription volume for the Enterprise tier.
Resource UsageDatabase Performance

PaceUI

Animated blocks, components, and templates for Next.js and TanStack Start. Built with Motion and shadcn - clean code you own.

GitHubTwitterDiscord

Products

BlocksComponentsTemplatesCraftsTanStack ChartsMCP ServerStarter KitsStyleX Components

Resources

DocumentationMotion ComponentsGSAP AnimationsNative AIBlogChangelog

Pricing & Account

PricingManage AccountLicensesAPI KeysAffiliate Program

Company

Contact UsDiscord CommunityPrivacy PolicyTerms of Service

© 2026 PaceUI. All rights reserved. Built by indie developer, Denish

PACEUI

SaaS Subscriptions
High-density view of segment volumes
Basic
Team
Scale
Enterprise
Active Team Tiers51,000 users
Quarterly Expansion+18.2% MoM
Churn Rate1.4% Avg
Scale Adoption32% Growth