thisdesign.space

REACT · library

Motion-Primitives

Copy-paste React animation primitives — text effects, dock, magnetic, morphing dialog.

A library of animation primitives by Cosden Solutions. Text Effect, Text Loop, Text Morph, Text Roll, Text Scramble, Text Shimmer, Animated Number, Dock, Glow Effect, Magnetic, Morphing Dialog, Spotlight, Tilt, Spinning Text — most of the motion vocabulary you keep wishing was a component. Built on Framer Motion + React, MIT-licensed, copy-paste source.

byudaysinhudaysinh
Visit motion-primitives.com

The homepage is the canonical demo. The lab points; doesn't mirror.

Quick start

Installbash

bun add motion

Usagetsx

// See motion-primitives.com — each component is copy-paste,
// no install of a wrapper library. Bring Framer Motion / `motion`.
import { TextScramble } from "@/components/motion-primitives/text-scramble";

<TextScramble className="font-mono">
  hello, world.
</TextScramble>

Links