Eased

Overview

Eased is a library of motion-first React components and blocks for shadcn, with every animation curve tuned in advance. The site lists 95 components; 65 are free under the MIT license, and a paid Pro tier adds showpiece components with source included. Every example on the site is the live component rather than a recording.

Components install with the shadcn CLI or through Eased's MCP server, so an AI agent can add them directly. Eased also ships a design skill for agents that encodes the rules, motion and spacing the components follow, such as keeping nested corners concentric as padding changes.

Features

• UI primitives with motion: Accordion, tabs, segmented control, popover, dialog, slider, switch, tooltip and other inputs with tuned springs.
• AI chat components: Composer, message, attachment, thinking bar, shimmer text and agent orb.
• Data display: Table, sortable table, sparkline and line chart, plus number roll and text swap effects.
• Code display: Code block, code tabs and snippet components with syntax highlighting.
• Blocks and templates: Pro blocks include an onboarding checklist, notification center, billing overview and spotlight tour.
• Agent support: An MCP server and an installable eased-skill registry item for coding agents.
• Themes: Light and dark themes driven by shared Eased tokens.

Tech stack

• React, Tailwind CSS, shadcn/ui
• Motion, Base UI
• Shiki, TanStack Table, d3-scale and d3-shape for specific components

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @eased/component-name