Image

Reveal an image through an animated pixel mosaic. Compare transition presets, then copy the component and its configuration.

Open in Studio

See it in action

Choose an example to try, then make it your own below.

All examples

Make it yours

Preparing preview…

0px
Desktop · 0pxReplay to restart the reveal.

React code

import { ImageGeneration } from '@/components/livenui/image'

<ImageGeneration
  preset={"pixels-organic"}
  strength={1}
  speed={1}
  autoReveal={true}
  paused={false}
  theme={"light"}
  images={["/your-image.jpg"]}
>
  <div style={{ width: 320, height: 240 }} />
</ImageGeneration>