Skip to content
Portfolio Kit

Lab Grid

Dense grid of side projects, experiments and toys, each with a status (live, WIP, archived), a small preview and a one-line meta row. Also renders as compact text rows.

Installation

pnpm dlx shadcn@latest add @portfolio-kit/lab-grid
First time? Add the @portfolio-kit registry to components.json
components.json
{
  "registries": {
    "@portfolio-kit": "https://www.parthjadhav.com/products/portfolio-kit/r/{name}.json"
  }
}

Usage

Examples

With filter

Filter the lab by kind with filter chips; LabGridEmpty covers a kind with nothing in it yet.

Compact

Text-only rows for minimal sites: title, year and tool, and a status, two columns on wide screens. Previews are dropped; a project hosted elsewhere opens in a new tab and shows ↗.

API Reference