Lab Card

A Lab project — a self-initiated tool, plugin or experiment, not client work — in the /lab grid and the More from the Lab row. Built on the blog card's surface (.card-blog); one layout at every width, stacking full-width on phones. Links to /lab/[slug].

Default

Usability Test MCP

Run a quick usability test on a live site, localhost or Figma flow from Claude Code or Codex, and get the three fixes that matter most.

Claude Code
Codex
MCP
TypeScript

View project

No image

An experiment with no image yet

Beta projects get a second badge; a missing image shows a placeholder.

View project

tsx

<LabCard project={project} />

Props

Prop	Type	Default	Description
`project`*	`LabProject`	-	Lab project data (matches the Sanity labProject type). Image: mainImage, else the video thumbnail, else a placeholder. Shows the title, excerpt and up to four "Built with" chips.
`priority`	`boolean`	`false`	Loads the image eagerly. /lab passes it to the first card, the page LCP.
`className`	`string`	-	Additional classes for the link wrapper