Components•Project index
Components•Project index
Project index
A ledger of work. Titles sit on the left; on hover a dossier card rises from the bottom right and holds still while you move between rows, dissolving its media and swapping only what changes. The rules catch a soft light under the pointer. Touch screens get an expanding list.
Dependencies
Copy below cli
npx shadcn add @bjork-ui/project-indexHow to use
import { ProjectIndex, type ProjectIndexItem } from "@/components/bjork-ui/galleries/project-index";const items: ProjectIndexItem[] = [ { id: "silt", title: "Silt", href: "/work/silt", year: 2026, role: "Particle type playground", services: ["Type sampling", "Particle physics"], outcome: { value: "20k", label: "particles set as live type" }, category: { label: "Studio", color: "#f0705a" }, media: { type: "image", src: "/silt.webp", alt: "Silt" }, }, { id: "sumi", title: "Sumi", href: "/work/sumi", year: 2026, role: "Watercolor koi pond", services: ["Schooling koi", "Watercolor bleed"], media: { type: "video", src: "/sumi.mp4", poster: "/sumi.webp", alt: "Koi" }, },];export function Work() { return <ProjectIndex heading="Selected work" items={items} />;}
Tools and components
(08)- 01SiltStudio2026Particle type playground. Type sampling, Particle physics, Palette system, PNG export. 2026. 20k particles set as live type
- 02IntaglioStudio2026Engraved stamp shader studio. Line engraving, Perforated stamp edge, Image upload, Export. 2026. 4 engraving patterns
- 03PhosphorStudio2026CRT shader studio. Scanlines and phosphor mask, Screen curvature, 3D television, Video input. 2026. 12 tuned display presets
- 04SumiStudio2026Watercolor koi pond. Schooling koi, Watercolor bleed, Ink palettes, PNG export. 2026. 5 ink palettes
- 05Periodic tableComponent2026Data table component. Category colour system, Hover detail, Keyboard grid. 2026. 118 elements in one grid
- 06TimerComponent2026Countdown instrument. Rolling digits, Drag to set dial, Presets, Keyboard control. 2026
- 07Message dockComponent2025Messaging component. Spring layout, Expanding composer, Avatar rail. 2025
- 08Ruler carouselComponent2025Gallery component. Scroll snapping, Tick ruler, Drag with momentum. 2025
Studio/202601/08
SiltParticle type playgroundType sampling / Particle physics / Palette system / PNG export20kparticles set as live typeOpen project↵