Docs
AI Blob Warp
Circular avatar with an animated Paper Design Warp shader and motion-safe pacing
Component demo
Circular avatar wrapping Paper's Warp shader. Sizes are Tailwind classes on the root; behavior and palette are tuned with warpProps.
Default root uses size-8. Override with any square utility.
32px
Fixed warp defaults; only the frame changes.
48px
Fixed warp defaults; only the frame changes.
64px
Fixed warp defaults; only the frame changes.
96px
Fixed warp defaults; only the frame changes.
Each tile passes a partial warpProps object merged over the component defaults. Scroll — off-screen instances pause to save work.
Default
Library defaults from `ai-blob-warp`: checks, Cult-style gradient stops.
Faster
Higher `speed` — motion still pauses off-screen and with reduced motion.
Warm
Peach / coral palette override via `colors`.
Deep swirl
Stronger `swirl` and `distortion` for a busier surface.
Large frame
Same shader tuning; bigger hit target with `className` sizing.
Pro workflow
Open in v0 and the Pro CLI install shortcut are part of Cult UI Pro. Upgrade to use them in your projects.
Get Propnpm add @paper-design/shaders-react motion
Source code is available for Pro members.
Upgrade to copy and use these components in your projects.
View pricing