A production component library·Now in private beta
stable Conversion

SDF Pricing

Three pricing tiers with amount, a deliverables footer, and a featured tier — the real Webflow Pricing component.

Sign in to copy
Pricing

Brand work, priced so you know exactly what you're buying.

Pick a tier. Lock the scope. Ship without surprises. Every option below comes with a fixed price, a defined deliverable list, and a clean handoff.

01 / Tier
Most Popular
$1,500/ project

Mark

A single primary mark with variations, color palette, and typography pairing. Delivered as vectors with the file types you actually need.

Get started
Deliverables
  • Primary mark + 3 lockup variations
  • Brand color palette (hex, RGB, CMYK)
  • Typography pairing & tracking specs
  • Vector files: SVG, PDF, AI, EPS, PNG
03 / Tier
$12,000starting

System

Discovery, positioning, voice, identity, motion principles, and a brand book that reads like a product spec. For brands building something durable.

Get started
Deliverables
  • Everything in Identity, plus
  • Brand strategy + positioning workshop
  • Voice & tone guide with examples
  • Application mockups (web, print, swag)
PricingComponent.tsx 156 lines · TypeScript

The full source is for members

Sign in and choose a plan to view and copy PricingComponent.tsx. The live preview above is free to explore.

Sign in

How to use. Copy PricingComponent.tsx into your project (it's self-contained — the styles ship with it and dedupe across instances in React 19). Theme it by setting --sdf-* tokens on any ancestor. No dependencies, no build step.

All React components
A Stacklumen Product