Shadcn Project Card Blocks

A typographic work index of ruled rows, each naming the project, role, year, and a one-sentence outcome with no thumbnail.

A project card grid where each tile pairs a thumbnail with a muted caption panel in a contrasting surface tone, no gradient.

A project card grid with a pill chip marking the year on each thumbnail, plus the project name, client type, and role below.

A dense four-column archive grid showing eight project thumbnails each with a name and year in a tight baseline row.

A bordered card grid showing project thumbnails with name, role, year, skill tags, and a view link per entry.

A two-column project grid where each full-bleed thumbnail carries a frosted bottom strip naming the project and role.

A three-column project grid where each card leads with a prominent row of skill and tool tags before the description, for technical work where the stack signals as much as the outcome.

A full-width horizontal card featuring one project with a Placeholder on the left and the name, description, discipline tags, and a case study link on the right.

A four-column grid of portrait-format project cards each showing a Placeholder at aspect-4/5 with the name, role, and a concrete two-sentence outcome description below.

Projects as quiet ruled rows with a small thumb, name, role, and year, for a text forward work index.

A full-width bordered project row with a Placeholder on one side and the name, description, tags, and view link on the other.

A project card showing two or three Placeholder images layered at offsets to suggest depth, with the project name and role below.

A project teaser card showing a Placeholder image, a one-line problem statement, a headline result figure, and a read-case-study link.

A full-width bordered band at the foot of a case study page with a Placeholder thumbnail, the next project name and meta, a forward link, and a back-to-all link.

A single project given full-width treatment with a wide aspect-16/10 Placeholder, a heading-scale project name, a two-sentence description naming the problem and outcome, and a view-case link.

A ruled divided list where each project appears as a row with a small square thumbnail, name, client type, role, year in tabular numerals, and an arrow.

A vertical project stack where each entry is led by a large muted editorial index number beside a Placeholder image with the name, role, and year below.

A two-column project grid where each card carries a Placeholder image, name, a one-line problem description, and a row of small skill and category chips.

A four-up project grid with a portrait Placeholder image, project name, and a single muted role line per card, nothing else.

A project card rendered in its revealed state as a blueprint, showing the name, role, and arrow in an overlay strip with an outcome caption and year below the image.