Illustrations

Illustrations are animated bento cards and small UI scenes, such as charts, gauges and app previews, that make a feature section or landing page more visual. They are built with shadcn/ui, motion and Tailwind CSS and are part of the paid plans.

Use an illustration

  1. Open Get the Code on the illustration you want.
  2. Install it with the shadcn CLI or copy the source. Illustrations use the motion package for their animations, so install it if your project does not have it yet.
  3. Place it inside a card or a feature grid and replace the sample values.

Tips

  • Pair illustrations with feature sections to show what a feature does instead of describing it.
  • Keep motion subtle and consider pausing it for visitors who prefer reduced motion.
TemplatesPage Builder