Billing (Web app)
Monetization & Billing · 7 checks · 19 resources
The account billing portal where a customer manages payment method, invoices and failed charges.
Before you ship
- 01Payment method on file — the current card or payment method, shown with masked details
- 02Add or update payment method action — a way to enter a new card or change the current one
- 03Next billing date and amount — when the next payment will be taken and for how much
- 04Invoices and receipts — a list of past charges with the ability to download a PDF invoice for each
- 05Tax and VAT — applicable tax shown on invoices and billing history
- 06Failed payment recovery — clear messaging and recovery instructions when a payment attempt has failed
- 07Billing contact email — the address where invoices and billing notifications are sent, often not the account owner's
Resources that help you build this
- Chakra UI · 114 accessible React components with a token-driven styling systemComponent LibrariesS
- Mantine · 150+ styled React components, 70+ hooks, CSS modules, no runtime CSS-in-JSComponent LibrariesS
- Open Design · Local-first desktop app that turns a coding agent into a design engineAgent Design ToolingS
- React Bits Pro · 703 paid React items in one license-gated shadcn registry: 134 animated components, 538 blocks, 11 templates and an Agent KitComponent LibrariesS
- Refero · Searchable library of real product screens, user flows and design systems, with an MCP serverInspiration GalleriesS
- ReUI · 1,052 free shadcn components, 502 pro blocks, 10 templates, hosted MCPComponent LibrariesS
- affectUI · 93 React components, screens, and blocks for AI products, each one dependency-free fileAI Interface KitsA
- Flowbite · 56+ MIT Tailwind components with vanilla-JS behaviour, plus a paid 450+ block libraryComponent LibrariesA
- HextaUI · 103 shadcn registry items: primitives plus AI, auth, billing, settings and team blocksComponent LibrariesA
- shadcn Studio · 800+ shadcn blocks, 16 templates, themes, MCP server and Figma-to-codeBlocks, Templates & ThemesA
- Shopify Polaris · Shopify's admin design system, now shipped as framework-agnostic web componentsComponent LibrariesA
- Tremor · 40 copy-paste React chart and dashboard components, plus 300+ free blocksComponent LibrariesA
- Watermelon UI Dashboards · Nine full React admin dashboards installed through the shadcn CLI from a public registryBlocks, Templates & ThemesA
- Nicely Done · Searchable index of ~199k SaaS screens, 12.5k flows and 29k UI componentsInspiration GalleriesB
- SaaSFrame · 5,000+ SaaS screens, flows, emails, patterns, responsive views, Figma files and screenshot text searchInspiration GalleriesB
- ShadcnShip · shadcn blocks pre-wired to Supabase auth, Stripe billing and Resend emailComponent LibrariesB
- PayKit · TypeScript billing framework that runs Stripe subscriptions, webhooks, and usage inside your appUtilities & NamingC
- Polar · Merchant of record for developers with payments, subscriptions, and usage-based billingUtilities & NamingC
- Stripe · Financial infrastructure for payments, billing, and money movementUtilities & NamingC