component

Portrait tile wall

Running live. Go ahead and touch it.

Three carousel rows of square artwork tiles moving in alternating directions.

See it in the design system

How it behaves

  • Every supplied image belongs to one of three looping rows
  • Rows move in alternating directions and pause on hover or focus
  • Reduced motion shows native horizontal scrollers
  • Images cover each square tile from the center

Find more that moves like this

Kind
component
Blueprint
image-showcase 1.0.12
Moves by
autoplay, entrance, hover

Import

import { PortraitTileWall } from "@/components/shared/animation/portrait-tile-wall";

Props

PropWhat it does
itemsImages with id, src, and alt
labelAccessible name for the group
speedCarousel movement in pixels per second. Defaults to 60
classNameStyles for the outer element

Your agent builds it. You take the credit.

Portrait tile wall ships inside the Image Showcase blueprint. These instructions tell your agent to take only this piece.

Version
1.0.12
Files
86
Dependencies
20
Assets
24

Paste this into Claude Code, Codex, Cursor, or whichever agent you trust today.

  • Building a blueprint runs its code, so use an isolated environment.
  • License: UNLICENSED.
  • The three layouts derive from third-party design images supplied as references, whose reuse rights have not been cleared. Confirm the rights before any public release.
  • The portrait names are fictional placeholders, replacing names of fictional characters in the reference, and are not real endorsements.
  • The references show photographs. This build uses color gradients instead, and an item's optional image field replaces them. The actions link to # until pages exist, and the reference's navbar is not built.
  • The portrait wall and community close follow a user-supplied third-party design image. The reused Artify images and Artfolio name are illustrative; rights and the contact address have not been cleared. Replace hello@example.com before release.
website

Pallet Ross

A creative network landing page where one set of cards travels through pinned scroll stages, from arc to cascade to grid.

website

Sixpay

A fintech homepage with detail panels in the navbar, a phone between tilted photos, rotating feature tabs, and a looping carousel of customer stories.

website

Artify AI

A dark AI image generator homepage with a floating navbar, a staircase of images that climbs and separates on scroll, and a drifting row of partner logos.

websiteNew

Eduvet University

A university homepage with a split photo hero, founder message, campus gallery, interactive departments, news, and an admissions preview.