Design, publish, get feedback

Better UI components, built together.

Publish UI components, get feedback on the code, or build one with a friend in a live pair session.

Be among the first to publish a component.

See how it works

notification-card.tsx● Autosaved
PreviewLightDark

New Comment

From DesignGuru22

Mark As Read
A mock-up of the editor. Teressa hasn't launched yet.

The problem

Good components are hard to find. Honest feedback is harder.

Components that are accessible, well built and true to your theme are rare. Many look fine in one mode, break in the other, and skip the small details.

And when you make one yourself, real feedback is just as hard to come by. Teressa is a place to publish components that pass a quality bar and hear what people think: the focus ring, the empty state, the way it behaves in dark mode, how it works from a keyboard.

Focus statesEmpty statesDark modeKeyboard use

How it works

Build it. Publish it. Hear what people think.

  1. 01

    Build

    Open the editor and write your component against your themes. The preview updates as you type, and drafts save as you go.

  2. 02

    Publish

    Pass the quality checklist and publish under MIT. Anyone can copy the code or install it with one command.

  3. 03

    Get feedback

    Readers comment on specific lines or answer guided questions on accessibility, API design and polish. You mark what you've addressed.

Pair sessions Prefer company? Invite one person into a live pair session and build it together.

Features

Everything you need to make one component well

Live pair sessions

Build a component with someone, in the same editor.

Invite one person to a draft. You both edit the same file with your own cursors, see the same live preview, and talk in a side panel. When it's ready, publish it with both of you credited as co-authors.

notification-card.tsx · pair sessionAS
Chat

AnaFocus ring looks off on the dark theme.

SamSwitching it to the ring token now.

AnaNice. Ready to run the checklist?

  • One invitePairs are two people. Send a link to a draft and they're in.
  • One previewYou both see the component render as either of you types.
  • Shared creditPublish with both names on it. Co-authors are listed on the page.

Solo editor

A code editor with the preview right beside it.

Write in TypeScript and watch the component render against your themes. Flip between light and dark whenever you like. Drafts autosave, and every version is kept so you can go back.

  • Live preview against your themes
  • Light and dark toggle
  • Autosaved drafts with version history
pricing-toggle.tsx● Autosaved
Version history

v4 Fixed focus ring 2 min ago

v3 Use ring token yesterday

v2 First working draft yesterday

LightDark

Publishing

A checklist before anything goes live.

Publishing isn't a button press. Your component has to clear a short list of checks first, so what people install is something they can rely on. MIT is the default license.

  • TypeScript compiles
  • Accessibility check passes
  • Theme tokens, not hardcoded colors
  • Works in light and dark mode
Publish checklistMIT
  • ✓TypeScript compiles
  • ✓Accessibility check passes
  • ✓Theme tokens, not hardcoded colors
  • ✓Works in light and dark mode
Publish component

Browse and use

Find something, try it, take it.

Search the gallery, preview any component with a theme switcher, and copy the code in one click. Or install it with one command. Want to change it? Fork it. The original author stays credited.

  • Searchable gallery
  • Live preview with theme switcher
  • One-click copy and registry install link
  • Dependency list on every page
  • Fork and remix with attribution
Search components…ZincRoseBlue
Command palette
Pricing toggle
Date range
Empty state
Install with one commandCopyFork

Feedback

Comments that point at the actual code.

Readers can pin a comment to a line, or answer a structured question about accessibility, API design or visual polish. Authors mark feedback as addressed, so everyone can see what changed.

  • Structured questions
  • Inline comments pinned to lines
  • Mark feedback as addressed
CommentsAccessibilityAPI designVisual polish

Accessibility Line 14

Add an aria-label here. Screen readers won't announce the icon-only state.

Mark as addressed

Quality standards

A quality bar that keeps rising.

Every published component clears the same checks. Feedback then keeps improving it after it ships.

  1. 01

    Accessible

    Each component passes an accessibility check before it can be published.

  2. 02

    Theme-aware

    Theme tokens instead of hardcoded colors, and it has to work in both light and dark mode.

  3. 03

    Always improving

    Readers pin comments to lines and answer structured questions. Authors mark feedback as addressed, and version history shows what changed.

For developers

Copy it, or install it.

Install with one command and the files land in your project, dependencies included. Or copy the code and paste it in.

  • MIT licensed by default
  • Uses your theme tokens, so it matches your app
  • Dependencies listed before you install
Terminal
$ npx shadcn add https://teressa.example/r/notification-card.json

Placeholder URL. The real address will be announced at launch.

app/page.tsx
import { NotificationCard } from "@/components/ui/notification-card"

export default function Page() {
  return <NotificationCard />
}

FAQ

Questions, answered.

What license are components published under?

MIT by default. That means you can use them in personal and commercial projects, keep the copyright notice, and there's no warranty. Each component page shows its license.

How much does it cost?

Pricing isn't set yet. Join the waitlist and we'll email you the details when Teressa opens.

Who can publish?

Anyone with an account who passes the quality checklist.

How do pair sessions work?

Invite one person to a draft with a link. You both edit the same file with your own cursors, see the same live preview and talk in a side panel. When it's ready, publish it with both of you credited as co-authors.

Be there when we open.

Join the waitlist and we'll send one email when Teressa is ready. Nothing else.

Be among the first to publish a component.