stream/ui
v0.1 · public beta

UI that doesn't whisper.

Components, full page sections, a crisp icon set, and a labs drawer full of weird experiments. Typed, accessible, and loud by default. Copy it in, make it yours.

Browse components Star on GitHub
bun add @streamui/react

fig. 01 — specimens

Deploy succeeded

stream-ui-docs is live on production.

2s

Loud mode

Maximum contrast. No regrets.

now streaming

lofi beats to ship UI to

2:143:41
newbetastablelabs
  • Tailwind ready
  • React ready
  • Next.js ready

00What's included

Four parts, one design language.

Install one package or copy the source into your repo. Plain React and Tailwind, with no theme provider.

01Components

Accessible primitives, every state styled.

Each specimen is the real component. Try it with a mouse or the keyboard: hover, press, focus, and disabled all have defined states.

button.tsx4 variants
input.tsxwith icon

Used for release notes only.

switch.tsx+ checkbox
Push notifications
Beta features
Disabled
tabs.tsxarrow keys work

The rendered component, styled with your theme tokens.

progress.tsxinteractive
Uploading assets60%
badge.tsx+ avatar stack
stablebetalabsdeprecated
AKRMJSTW+9

02Sections

Page sections built from the same parts.

Composed from the same primitives, so a hero and a pricing table never disagree about what a button looks like.

  • Hero

    ×6

  • Pricing

    ×4

  • Features

    ×5

  • Testimonials

    ×3

  • FAQ

    ×2

  • Footer

    ×4

03Icons

One grid, one stroke weight.

Drawn on a 24px grid at a 1.75 stroke. Search the set and click any icon to copy its JSX.

32 shown · click to copy

04Labs

Experiments in progress.

Interaction prototypes that haven't graduated into the main library. Their APIs can change between releases.

  • lab/shape-rollerexperimental
    roll #0

    Shape roller

    Randomizes shape, color, and rotation on each roll.

  • lab/magneticexperimental

    Magnetic button

    The button drifts toward the cursor within its area.

  • lab/wobbleexperimental

    Wobble type

    Staggered CSS transitions on hover. No JavaScript.

05 Get started

Start with one component.

Add the button, see how it fits your codebase, then pull in more as you need them.

bun add @streamui/react
Browse components