One Mohr UI Kit · Animated component library · In active development

In active development · v0.1

One Mohr UI Kit

An animated, accessible React component library. Motion-first components that feel alive — built with Framer Motion, Tailwind CSS v4, and TypeScript strict mode.

Why this library

Motion-first

Spring animations by default. Every interaction has physics.

Accessible

WCAG AA baseline. Keyboard navigation included.

Composable

Atomic design. Build complex UIs from simple primitives.

Publishable

Headed to npm as @patrickmohr/ui with full type declarations.

Buttons

Badges

NewPublishedBetaDeprecatedv2.0.0Draft

Cards — hover to animate

Design tokens

stable

CVA variants and Tailwind v4 custom properties for a consistent visual language.

Motion system

stable

Framer Motion spring animations with sensible defaults. Override per-component.

Dark mode

stable

next-themes integration. System preference or manual toggle, no flash.

Tabs — sliding spring indicator

Buttonstable
Badgestable
Cardstable
Accordionstable
Tabsstable
Toaststable
SearchInputstable
FadeInstable
Navbarstable
Dialogstable
Selectstable
Tooltipstable

Search input

Toast notifications

Accordion — animated expand / collapse

Select — animated dropdown

Tooltip — hover to reveal

Dialog — animated modal

Form primitives — Input, Textarea, Label, FormField

We'll never share your email.

Max 500 characters.

One Mohr UI Kit · Built with React 19, Next.js 16, Framer Motion, Tailwind CSS v4