A library of production-ready React blocks built with Tailwind CSS and shadcn/ui. Copy, paste, and customize for your next project.
showcase28
Browser-chrome card rendering a markdown source editor on the left and the rendered HTML on the right — minimal monochrome syntax markers, structured preview blocks (headings, paragraphs, lists, fenced code). Every label is editable; no media props required.
showcase29
Browser-chrome card rendering an AI prompt and a structured response — markdown blocks (headings, paragraphs, lists, quotes, code), citation list, copy/regenerate/apply footer. Every label is editable; no media props required.
showcase30
Browser-chrome card rendering a live spreadsheet — formula bar with cell reference, typed columns, status-toned cells, and a selected total cell with outline ring. Every label is editable; no media props required.
showcase31
Browser-chrome card pairing two minimal code panes — TypeScript type definitions on the left, real call-site usage on the right. Monochrome syntax with muted comments. Every label is editable; no media props required.
showcase32
Browser-chrome card pairing two minimal code panes — GraphQL query on the left, mirrored JSON response on the right. Monochrome syntax with muted comments and a timing footer. Every label is editable; no media props required.
showcase33
Browser-chrome card hosting a regex playground — pattern + active flag pills up top, test rows with inline match highlights and capture column, summary footer. Every label is editable; no media props required.
showcase34
Browser-chrome card pairing two minimal code panes — same logic in two languages (TypeScript and Python by default). Monochrome syntax with muted comments and language badges. Every label is editable; no media props required.
showcase35
Browser-chrome card pairing a before/after code migration — eyebrow + title + description above each pane, monochrome syntax, and an apply-migration footer with diff summary. Every label is editable; no media props required.
showcase36
Browser-framed product screenshot with surrounding feature callouts.
showcase37
Horizontally scrollable row of wide product showcase frames with captions.
showcase38
A pinned product image beside a scrolling list of feature steps.
showcase39
Tabbed product screenshots in a browser frame with captions.
showcase40
Bento mosaic mixing product screenshots with text and accent tiles.
showcase41
A ruled, type-forward project index where each row reveals a floating thumbnail on hover.
showcase42
An asymmetric mosaic image gallery with mixed-span tiles and monospace frame captions.
showcase43
A single featured project with a tall image and a meta column of client/role/year rows, a paragraph, and a CTA.
showcase44
Centered eyebrow, heading, and description above a grid of borderless brand cards — each with a square, colorable logo plate, a title and short description, and a full-width animated seal detail button.