Email inbox template for React

A dense email list, a reading pane and threading, styled by Precision Light. Switch to 5 other design systems below.

$0 forever. No card required. Other install options

Inbox

2 new

Payout: $12,400 deposited

From Stripe · to me

May 22, 9:42 AM

Hi Marvin,

Your payout for May 21 has cleared and is now in your bank account. Below is a quick summary of the transactions included in this payout.

  • 5 charges totaling $12,840.00
  • 2 refunds totaling -$440.00
  • Stripe fees: $0.00 (covered by your plan)

You can view the full payout in your dashboard.

The Stripe team

Built on the stack you already use

  • React
  • Next.js
  • TypeScript
  • Tailwind CSS
  • shadcn/ui
  • Radix UI

Everything the screen needs

  • Source you own

    Install the components with the shadcn CLI. Every line lands in your repo.

  • 6 design systems

    Switch the same layout between design systems that fit it, with no rewrite.

  • One theme for every screen

    Colors, corner radius and shadows come from CSS variables, so one change restyles it all.

  • Built by your agent

    Ask Claude Code, Cursor or Codex for this screen. The MCP gives it the system and the rules.

  • Checked before handoff

    Your agent reviews accessibility, spacing and copy against the review rules.

  • Interface only

    No database or sign-in wiring to remove. Connect the data you already have.

Free to build. Pay for your own brand.

Developer

For individual builders.

$0forever

No card required
  • Unlimited UI and UX guidance
  • Design systems
  • Templates
  • Slides
  • Illustrations
  • Video
Install free

Pro

Teach your coding agent your own brand.

$20/ month

$240 a year after the trial.Save $48
  • Everything in Developer
  • Your brand guidelines, kept private, applied to every build
  • GitHub PR reviews
  • Mobile tools
  • 3D tools
  • Shopify tools
  • $240 a year after the 14-day free trial.
  • Renews automatically until you cancel.
  • Cancel anytime from Manage subscription.

Agency & Enterprise

One private brand for every client, product, or business unit.

Custompricing

Scope and price follow the call.
  • Everything in Pro
  • A separate private brand for every client or business unit
  • White label under your own name
  • We set it up with you
Get a free 15-minute call

Questions

What is in the Inbox template?

A dense email list, a reading pane and threading. Every part is a shadcn-compatible component you can edit.

Is it free?

Yes. The Developer plan is $0 forever, with no card. Pro adds your own private brand for $20 a month, billed yearly.

How do I install it?

Run npx better-design to connect your coding agent, then ask it for the Inbox template. To add one component, use npx shadcn@latest add with its registry link.

Which design system should I pick?

Start with Monochrome Industrial, the default for this layout. The switcher lists 5 others that fit it.

Can it use my own brand?

Yes, on Pro. Your agent applies your private brand guidelines to every screen it builds.

Does it include a backend?

No. The template is the interface only, so you connect your own data and sign-in.

Build the Inbox screen in your own repo

$0 forever. No card required. Other install options

Built with Better Design.