SkillGitHub
All components
pixelated-image

Pixelated image

Uses image resolution as a controllable reveal and transition material.

  • Keyboard ready
  • Reduced motion
  • TypeScript
Scene
editorial · warm
Runtime cost
Medium
Motion engine
motion
Installnpx shadcn@latest add https://motion-lexicon.pages.dev/r/pixelated-image.json

Component behavior

Pixel structure resolves into a complete image Uses image resolution as a controllable reveal and transition material.

Suitable events

Use for browsing, focusing, scrolling, and dragging media.

Runtime information

Motion engine
motion
Runtime cost
Medium
Dependencies
motion
Open public Registry JSON