build69
build69  /  Components  /  Marketing Sections  /  Pricing

Pricing

v1.0.10Updated 27 Aug 2026

Pricing section with tier cards, billing toggles and comparison tables. Copy-paste block; baked-in demo content (edit the JSX to customise).

Preview

Live · 13 stories
Three TierOpen ↗
Why this is recommendedpricingplanstiersbilling+4

Pricing — three tier.

Recommended for+14
  • Landing pages
  • Pricing pages
  • Marketing pages
Tags+6
pricingplanstiersbillingmarketingsectionthreetier
Features+4
  • Three-tier, monthly/annual toggle, comparison-table, single-plan and feature-list layouts
  • Highlighted "popular" tier
  • Self-contained — no required props
  • i18n: prices and counts format through the locale layer (LocaleProvider / useB69Locale) — the ฿/THB demo currency stays baked per the section-block contract
Not recommended for−2
  • In-app billing settings

Install

Ask your agent, or call the MCP tool directly. The resolved bundle is written into your project.

get_registry_item({ name: "Pricing" })

Usage

import { PricingThreeTier } from '@/components/sections/pricing';

<PricingThreeTier />

Tick variants in the left menu — each adds a tab with that variant’s real story source, the same code the preview above renders.

Props

PropTypeRequired
className

Optional wrapper class override

string

Related