Retro Grid

Perspective grid scrolling forever toward the horizon.

Launch week · Day 3

Back to the grid

pnpm dlx shadcn@latest add https://paulkeys.org/r/retro-grid.json

Adds components/velora/retro-grid.tsx and merges the keyframes and tokens into your CSS.

Prop	Type	Default
`angle` Perspective angle of the grid plane	`number`	`55`
`cellSize`	`number`	`56`
`opacity`	`number`	`0.4`

Also accepts every <div> attribute, forwarded to the root element.

Reduced motion: The scroll animation is off; the perspective grid plane shows as a still grid under the top and bottom fades.
Keyboard: Decorative — nothing to operate.
Screen readers: Decorative; the wrapper is aria-hidden.

Perspective grid scrolling forever toward the horizon.

Launch week · Day 3

pnpm dlx shadcn@latest add https://paulkeys.org/r/retro-grid.json

Adds components/velora/retro-grid.tsx and merges the keyframes and tokens into your CSS.

Prop	Type	Default
`angle` Perspective angle of the grid plane	`number`	`55`
`cellSize`	`number`	`56`
`opacity`	`number`	`0.4`

Also accepts every <div> attribute, forwarded to the root element.

Reduced motion: The scroll animation is off; the perspective grid plane shows as a still grid under the top and bottom fades.
Keyboard: Decorative — nothing to operate.
Screen readers: Decorative; the wrapper is aria-hidden.