A collection of customizable UI blocks with interactive live previews
A mosaic of rounded tiles that mixes photos with two short text tiles, one with a detail photo at its base and one wide photo as the closing tile.
A brand mosaic of square tiles around one large central photo, mixing photographs with spaced-out taglines and a small mark.
A centered text block with a title, description, and CTA.
An oversized two-word headline split around a full-bleed photo, with a bracketed call to action at its center.
Media banner above a title, body lines, and a footer.
Table inside a Card with title and status badges.
Cap text length with a live character counter.
Cap text length with a live character counter.
Alternating inbound and outbound message bubbles.
Multiple checkboxes collected into a string array with a min-selection rule.
Multiple checkboxes collected into a string array with a min-selection rule.
Toggle multiple view options with checkbox items.
Bordered add-on cards that highlight when checked.
Clickable add-on rows showing a title, description, price, and a switch, each fully tappable via a wrapping label.
Thumbnail grid with selection ring.
Primary, secondary, and destructive tooltips with arrow color matching the content.
Tinted initials fallbacks using semantic tokens.
Swatch grid with a check icon on the active color.
TanStack Table, toggle individual columns on or off from a dropdown menu.
Popover + Command framework picker with a check mark.
Selected value shows an inline X that clears without reopening.
Searchable combobox using Command inside a Popover, bound via Controller.
Searchable combobox using Command inside a Popover, wired with form.Field.
Spotlight-style ⌘K palette toggled by a button or keyboard shortcut.
Inline numbers from sm up, "Page X of Y" on mobile.
TanStack Table, combines sorting, column filter, pagination, row selection, column visibility toggle, and per-row action menus.
Polished yes/no with icon and clear hierarchy.
Name, email, topic and message validated on submit.
Name, email, topic and message validated on submit.
A grid of media cards with a section header and item details below each image.
Two-column card grid with a serif section header and copy above each image.
Two-column split with serif headline, supporting copy, optional CTA, and a media panel.
Two-column grid with serif header, media on top, copy, and optional CTA per column.
A billing overview split with a dashboard preview card and two feature highlights, built for the app-shell preset.
A centered section header with supporting copy and a CTA, followed by two large side-by-side photos.
An editorial layout with a large photo, a short title and paragraph beside it, and two smaller photos offset below.
A two-weight studio title with a short intro and link beside a square photo, followed by a bordered row of client marks.
A labeled collection intro with a short headline, a row of three product photos with names, and a CTA, framed by thin rules.
A large square photo with a thin circular guide and crosshair, a smaller photo beside it and a short title with a paragraph on the side.
A short headline above two photos staggered on a diagonal, one landscape on the left and one portrait lower on the right.
A centered headline over a wide photo with a text and link card in its corner, beside a short paragraph and a tall photo.
A journal index with a small label and title, a large photo, three short articles with thumbnails and a tall photo in an offset grid.
Menu whose open/closed state is managed externally and reflected in the trigger label.
Read-only text value paired with a trailing icon button that copies it to the clipboard, with an animated check on success.
Icon and label swap to a check on copy.
Pill-shaped numeric counts with tabular figures.
Thumbnail grid with a selection ring for choosing a cover image.
Sign up with name, email, a strong password and terms.