# Step Grid

> One photo steps back into a grid of sliding rows.

Step Grid is an image animation ready for your AI assistant, React or plain JavaScript, with no dependencies. Also called scale-in grid, stepping card grid or grid loop showcase.

A single photo shrinks back to reveal the grid around it, then the rows slide sideways one card at a time before the photo grows to fill the frame again. It loops on its own and pauses off screen.

- Page: https://foundry44.dev/components/step-grid/
- Category: [Images](https://foundry44.dev/library/images/)
- Interactions: load
- Dependencies: none
- Licence: Pro

## With Pro

The AI prompt, the React component, the plain JavaScript file and the embed come with Pro, along with the live demo. Every setting is optional: with none, you get the effect as the preview shows it.

Settings: `focusScale`, `rows`, `interval`, `stepDuration`, `gap`.