Project 8 D - Fashion project with sidebar metadata and multi-column credits

Pro

Centered title with a wide 2:1 image, a four-column layout with metadata sidebar and narrative text, and a bordered credits section in a multi-column grid.

Shadcn Project 8 D block

Component data

ID
project8d
Access
pro
Created
Oct 1, 2025
Type
block
Libraries
Radix UI, Base UI, React Aria

Project 8 D block design & features

The block opens with a centered bold uppercase title and muted subtitle, followed by a wide 2:1 aspect hero image in a rounded container. A four-column grid places a one-column metadata sidebar (heading, year, location) on the left and three columns of narrative text on the right at a larger text size. A bordered credits section at the bottom uses a top border and distributes seven team members across a responsive grid that reaches three columns on large screens.

The wide 2:1 hero aspect creates a letterbox panoramic view. The four-column metadata split gives the sidebar a narrow, compressed presence while the narrative text occupies the majority of the width. The credits grid uses a top border to separate it from the main content. Larger body text in the narrative columns enhances readability. Entry animations are staggered. Built with Shadcn UI tokens.

The block balances a cinematic wide image with structured metadata and a generous narrative area. The multi-column credits layout is more scannable than a single-column list.

On smaller screens the four-column grid stacks to a single column, and the credits grid reduces to one or two columns.