Catalog composer

Generate

Describe a page or section. Generate assembles a small composition from real Patina catalog pieces, then shows the preview and JSX you can take with you.

Custom prompts

Sign in to generate

The sample on the right is a real catalog composition. Sign in if you want a custom prompt and a daily usage allowance.

Launch page

A canned catalog composition of the free Hero Centered and Feature 3-up blocks.

Live previewPatina catalog

hero-centered

Centered headline with CTA buttons.

Professional React components

Components that delight

A freemium component library for shadcn/ui. Motion primitives stay free. Marketing blocks unlock with Pro.

Browse free components

feature-3up

Three equal columns of capability.

Public primitives

Marquee, dock, and shimmer stay free. No license header.

Assembled blocks

Heroes, pricing, and chrome. One $49 unlock, no seat math.

Namespaced registry

@patina is public. @patina-pro reads X-License-Key.

JSX

import { Preview as HeroCentered } from "@/registry/heroes/hero-centered/preview";
import { Preview as Feature3up } from "@/registry/features/feature-3up/preview";

export function GeneratedComposition() {
  return (
    <div className="space-y-6">
      <HeroCentered />
      <Feature3up />
    </div>
  );
}