Ephemera

Overview

Ephemera is a free, open-source paper UI design system for React. Its components are styled as real stationery: buttons that press like typewriter keys, inputs on ruled lines, folder tabs, ledger tables, label-maker badges, dialogs that arrive like letters and receipt-style toasts.

The system has 28 core components built on Radix for keyboard and screen reader support, with the same APIs as shadcn/ui so they can be swapped in one at a time. A paper theme adds six paper types as CSS variables and five fonts, switched with a single attribute, and also re-skins existing shadcn/ui components. A set of extras covers decorative stationery pieces.

Features

• Six paper themes: Cream, Kraft, Ledger, Blueprint, Newsprint and Carbon.
• Forms: Typewriter-key button in ink, paper, ghost and danger variants, ruled input and notebook textarea, pen-ticked checkbox, ink-blot radio group, lever switch, select, slider and date picker.
• Layout and data: Card, folder tabs, accordion, separator, ledger table, breadcrumb and pagination.
• Overlays and feedback: Letter dialog, sheet, popover, tooltip, dropdown menu, receipt toast, alert, progress and skeleton.
• Extras: Receipt, ticket, boarding pass, polaroid, postage stamp, rubber stamp, envelope, wax seal and sticky note.
• Bundled fonts: Fraunces, IBM Plex Mono, Courier Prime, Caveat and Anton as registry items.
• One-step install: all.json installs the theme and every core component together.

Tech stack

• React, shadcn/ui, Radix UI, Tailwind CSS

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @ephemera/component-name