# shadcncraft full catalogue

> Every item in the shadcncraft registry, with tier, surfaces, install command, and
> preview links. Generated from the registry at build time.

Totals: 192 blocks, 55 components, 4 hooks, 11 Figma page designs, 1 site template, 22 free-tier items, 8 styles, 2 component bases, 16 base and style combinations, 24 colour themes, 5 icon libraries.

These are shadcncraft's own items. The Figma kits additionally carry the official
shadcn/ui component and block set, which is not counted here and is not served by this
registry. Figma page designs are Figma only: there is no React install for a page.

Field meanings. `Tier` is `free` (installable with no credentials) or `pro` (licence key
required). `Surfaces` states whether the item exists in the Figma library, the React
registry, or both. `Install` is the shadcn CLI command. `Preview` renders the item
standalone. Short index: https://shadcncraft.com/llms.txt
Figma plugin: https://www.figma.com/community/plugin/1596974152705664025

## Pricing

Every tier is a one-time payment with lifetime access to that tier, including
future updates. There is no subscription. Licences are counted in seats: a seat
is required for each person who has edit access to the Figma file, uses the Figma
plugin, or installs components from the registry. Developers who only maintain a
codebase that already contains installed components do not need a seat.
Upgrades between tiers are self-serve and charge only the difference:
https://shadcncraft.com/upgrade

### Base Figma

All official shadcn/ui components and blocks in Figma. Everything you need to start designing with a strong foundation.

Price (one-time, lifetime access, no subscription):
- Single (1 designer or developer): $119 USD
- Team (up to 5 designers or developers): $449 USD
- Enterprise (more than 5 designers or developers, or organization-wide use): $999 USD

Tax included.

Includes:
- shadcn/ui Figma UI kit: Official set only
- All 8 shadcn styles: Figma
- Icon library switching: Figma
- Figma plugin: Styles, themes & presets
- Storybook: Public online
- Agent Skills: Token sync only
- Updates: Free lifetime
- Usage: Unlimited commercial
- Support response: 24 hours

Excludes:
- 192 Pro Blocks
- 55 Pro Components
- Pro Pages & Sites

### Pro Figma

Pro Components, Blocks, and Templates. A complete Figma (.fig) design system that lets you assemble polished layouts in seconds.

Price (one-time, lifetime access, no subscription):
- Single (1 designer or developer): $299 USD
- Team (up to 5 designers or developers): $899 USD
- Enterprise (more than 5 designers or developers, or organization-wide use): $1,399 USD

Tax included.

Includes:
- shadcn/ui Figma UI kit: Official + Pro
- All 8 shadcn styles: Figma
- Icon library switching: Figma
- 192 Pro Blocks: Figma
- 55 Pro Components: Figma
- Pro Pages & Sites: Figma
- Figma plugin: Styles, themes & presets
- Storybook: Public online
- Agent Skills: Token sync only
- Updates: Free lifetime
- Usage: Unlimited commercial
- Support response: 12 hours

### Pro React

Production-ready React components, Blocks, and Pages built on shadcn/ui, with no Figma required. Install from the registry and ship polished, accessible interfaces in your own codebase.

Price (one-time, lifetime access, no subscription):
- Single (1 designer or developer): $249 USD
- Team (up to 5 designers or developers): $999 USD
- Enterprise (more than 5 designers or developers, or organization-wide use): $1,799 USD

Tax included.

Includes:
- All 8 shadcn styles: React
- Icon library switching: React
- 192 Pro Blocks: React
- 55 Pro Components: React
- Pro Pages & Sites: React (Site only)
- Storybook: Online + offline build
- Agent Skills: Sync + Figma to code
- Updates: Free lifetime
- Usage: Unlimited commercial
- Support response: 12 hours

Excludes:
- shadcn/ui Figma UI kit
- Figma plugin

### Pro Figma + React

Pro Figma design system plus matching React components. Build production-ready interfaces with aligned design and code.

Price (one-time, lifetime access, no subscription):
- Single (1 designer or developer): $499 USD
- Team (up to 5 designers or developers): $1,799 USD
- Enterprise (more than 5 designers or developers, or organization-wide use): $2,999 USD

Tax included.

Includes:
- shadcn/ui Figma UI kit: Official + Pro
- All 8 shadcn styles: Figma + React
- Icon library switching: Figma + React
- 192 Pro Blocks: Figma + React
- 55 Pro Components: Figma + React
- Pro Pages & Sites: Figma + React (Site only)
- Figma plugin: Styles, presets & React
- Storybook: Online + offline build
- Agent Skills: Sync + Figma to code
- Updates: Free lifetime
- Usage: Unlimited commercial
- Support response: 12 hours

## Licence

Full terms: https://shadcncraft.com/license. Operated by AHO Pty Ltd.

- Payment is one-time. There is no subscription.
- Lifetime access to the purchased tier, including all future updates to that tier.
- Unlimited personal and commercial projects, including client work.
- Items may be modified, combined with other works, and used in monetised products.
- Redistribution or resale of the kit itself is not permitted.
- Once installed from the registry, that source code is yours as part of your end product.

Seats. A seat is required for each person who has edit access to the Figma file, uses the
Figma plugin, or installs or customises components from the registry (that is, anyone
holding registry credentials). Developers who only build or maintain a codebase that
already contains installed components do not require a seat.

- Single: one individual.
- Team: up to five users.
- Enterprise: more than five users, or organization-wide use. Includes priority support.

Exceeding the licensed seat count requires an upgrade. Upgrades are self-serve at
https://shadcncraft.com/upgrade and charge only the difference between tiers.
Pro React is a cross-grade rather than a step on the ladder: Base Figma and Pro Figma
owners upgrade into Pro Figma + React, not into Pro React.
All sales are final; refunds are not provided for digital items.

## Styles

A base is the underlying component library, a style is the visual system (radius,
typography, icon set, and per-component tokens), and a theme is the colour palette.
24 colour themes can be layered over any style.

Every style re-themes the entire catalogue. A style combines with a component base
to form the registry style slug used in install URLs: radix-vega, radix-nova, radix-maia, radix-lyra, radix-mira, radix-luma, radix-sera, radix-rhea, base-vega, base-nova, base-maia, base-lyra, base-mira, base-luma, base-sera, base-rhea.

### Vega (`vega`)
Character: Clean, neutral, and familiar
Default icon library: lucide
Default body font: inter
Default heading font: inherit
Base color: neutral
Radius: default

### Nova (`nova`)
Character: Reduced padding and margins
Default icon library: lucide
Default body font: geist
Default heading font: inherit
Base color: neutral
Radius: default

### Maia (`maia`)
Character: Rounded, with generous spacing.
Default icon library: hugeicons
Default body font: figtree
Default heading font: inherit
Base color: neutral
Radius: default

### Lyra (`lyra`)
Character: Boxy and sharp. For mono fonts.
Default icon library: phosphor
Default body font: jetbrains-mono
Default heading font: inherit
Base color: neutral
Radius: default

### Mira (`mira`)
Character: Made for compact interfaces.
Default icon library: hugeicons
Default body font: inter
Default heading font: inherit
Base color: neutral
Radius: default

### Luma (`luma`)
Character: Fluid, luminous, and soft.
Default icon library: lucide
Default body font: inter
Default heading font: inherit
Base color: neutral
Radius: default

### Sera (`sera`)
Character: Editorial and typographic.
Default icon library: lucide
Default body font: noto-sans
Default heading font: playfair-display
Base color: taupe
Radius: default

### Rhea (`rhea`)
Character: Like Luma but compact.
Default icon library: lucide
Default body font: inter
Default heading font: inherit
Base color: neutral
Radius: default

## Component bases

### Radix UI (`radix`)
Optimized for fast development, easy maintenance, and accessibility.

### Base UI (`base`)
Components for building accessible web apps and design systems.

## Icon libraries

Any item can be emitted against any of these libraries. In Figma the active set is a
native variable; in React the CLI resolves icons from `iconLibrary` in components.json.

- Lucide (`lucide`)
- Tabler Icons (`tabler`)
- HugeIcons (`hugeicons`)
- Phosphor Icons (`phosphor`)
- Remix Icon (`remixicon`)

## Blocks

### Pro Marketing (121 blocks)

#### Banners (10)

##### banner-1
Name: Banner 1
Kind: block
Archetype: Pro Marketing
Categories: banners
Tier: pro
Surfaces: Figma and React
Summary: A low-height horizontal banner with an icon, short message, and inline input with primary action.
Install: npx shadcn@latest add @shadcncraft/banner-1
Page: https://shadcncraft.com/blocks/pro-marketing/banners/banner-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/banner-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94327

##### banner-2
Name: Banner 2
Kind: block
Archetype: Pro Marketing
Categories: banners
Tier: pro
Surfaces: Figma and React
Summary: A compact banner presented as a card with icon, short message, input field, and primary action, plus a close control.
Install: npx shadcn@latest add @shadcncraft/banner-2
Page: https://shadcncraft.com/blocks/pro-marketing/banners/banner-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/banner-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94327

##### banner-3
Name: Banner 3
Kind: block
Archetype: Pro Marketing
Categories: banners
Tier: pro
Surfaces: Figma and React
Summary: A low-height horizontal banner with an icon, short announcement text, and multiple call-to-action buttons, plus a dismiss control.
Install: npx shadcn@latest add @shadcncraft/banner-3
Page: https://shadcncraft.com/blocks/pro-marketing/banners/banner-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/banner-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94327

##### banner-4
Name: Banner 4
Kind: block
Archetype: Pro Marketing
Categories: banners
Tier: pro
Surfaces: Figma and React
Summary: A horizontal announcement banner with an icon, single-line message, two clearly ranked actions, and a dismiss control.
Install: npx shadcn@latest add @shadcncraft/banner-4
Page: https://shadcncraft.com/blocks/pro-marketing/banners/banner-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/banner-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94327

##### banner-5
Name: Banner 5
Kind: block
Archetype: Pro Marketing
Categories: banners
Tier: pro
Surfaces: Figma and React
Summary: A horizontal banner with an icon, short explanatory text, and a grouped set of actions including primary, secondary, and tertiary options, plus a dismiss control.
Install: npx shadcn@latest add @shadcncraft/banner-5
Page: https://shadcncraft.com/blocks/pro-marketing/banners/banner-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/banner-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94327

##### banner-6
Name: Banner 6
Kind: block
Archetype: Pro Marketing
Categories: banners
Tier: pro
Surfaces: Figma and React
Summary: A consent banner that pairs a low-height inline message with a stacked action layout in the card variant.
Install: npx shadcn@latest add @shadcncraft/banner-6
Page: https://shadcncraft.com/blocks/pro-marketing/banners/banner-6
Preview: https://shadcncraft.com/view/pro-marketing/blocks/banner-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94327

##### banner-7
Name: Banner 7
Kind: block
Archetype: Pro Marketing
Categories: banners
Tier: pro
Surfaces: Figma and React
Summary: A low-contrast, single-line banner with centered text and a close action.
Install: npx shadcn@latest add @shadcncraft/banner-7
Page: https://shadcncraft.com/blocks/pro-marketing/banners/banner-7
Preview: https://shadcncraft.com/view/pro-marketing/blocks/banner-7
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94327

##### banner-8
Name: Banner 8
Kind: block
Archetype: Pro Marketing
Categories: banners
Tier: pro
Surfaces: Figma and React
Summary: A compact announcement banner with inline link styling and a dismiss action.
Install: npx shadcn@latest add @shadcncraft/banner-8
Page: https://shadcncraft.com/blocks/pro-marketing/banners/banner-8
Preview: https://shadcncraft.com/view/pro-marketing/blocks/banner-8
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94327

##### banner-9
Name: Banner 9
Kind: block
Archetype: Pro Marketing
Categories: banners
Tier: pro
Surfaces: Figma and React
Summary: A high-contrast, full-width banner for urgent or high-intent messages like hiring, launches, or announcements.
Install: npx shadcn@latest add @shadcncraft/banner-9
Page: https://shadcncraft.com/blocks/pro-marketing/banners/banner-9
Preview: https://shadcncraft.com/view/pro-marketing/blocks/banner-9
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94327

##### banner-10
Name: Banner 10
Kind: block
Archetype: Pro Marketing
Categories: banners
Tier: free
Surfaces: Figma and React
Summary: A minimal announcement banner for low-friction updates.
Install: npx shadcn@latest add @shadcncraft/banner-10
Page: https://shadcncraft.com/blocks/pro-marketing/banners/banner-10
Preview: https://shadcncraft.com/view/pro-marketing/blocks/banner-10
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17859-94327

#### Benefits (13)

##### benefits-1
Name: Benefits 1
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A benefits section with a headline and intro, followed by multiple feature rows that alternate text and visual previews.
Install: npx shadcn@latest add @shadcncraft/benefits-1
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-2
Name: Benefits 2
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A benefits section with a headline and intro, followed by multiple feature cards arranged in a staggered grid.
Install: npx shadcn@latest add @shadcncraft/benefits-2
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-3
Name: Benefits 3
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A benefits section with a headline and intro, followed by stacked feature sections that alternate text and large visual panels.
Install: npx shadcn@latest add @shadcncraft/benefits-3
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-4
Name: Benefits 4
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A simple benefits block that displays a small set of features as icon-led items with short titles and descriptions.
Install: npx shadcn@latest add @shadcncraft/benefits-4
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-5
Name: Benefits 5
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A benefits block with a headline and short intro, followed by a grid of icon-led features arranged in two rows.
Install: npx shadcn@latest add @shadcncraft/benefits-5
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-6
Name: Benefits 6
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A benefits block with a headline and short intro, followed by large visual feature cards.
Install: npx shadcn@latest add @shadcncraft/benefits-6
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-6
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-7
Name: Benefits 7
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A benefits block with a headline and intro, followed by two primary feature highlights with large images.
Install: npx shadcn@latest add @shadcncraft/benefits-7
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-7
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-7
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-8
Name: Benefits 8
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A benefits block with a headline and intro, followed by a single large hero image.
Install: npx shadcn@latest add @shadcncraft/benefits-8
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-8
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-8
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-9
Name: Benefits 9
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A benefits block with a strong headline and supporting text split across two columns.
Install: npx shadcn@latest add @shadcncraft/benefits-9
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-9
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-9
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-10
Name: Benefits 10
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A benefits block built around a large, full-width image with short text overlaid directly on the visual.
Install: npx shadcn@latest add @shadcncraft/benefits-10
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-10
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-10
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-11
Name: Benefits 11
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A benefits block with a strong headline on the left and a longer supporting explanation on the right, with a clear visual hierarchy between primary and secondary text.
Install: npx shadcn@latest add @shadcncraft/benefits-11
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-11
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-11
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-12
Name: Benefits 12
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: pro
Surfaces: Figma and React
Summary: A two-column layout that displays a list of items, each paired with an icon, title, and short description.
Install: npx shadcn@latest add @shadcncraft/benefits-12
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-12
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-12
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-91861

##### benefits-13
Name: Benefits 13
Kind: block
Archetype: Pro Marketing
Categories: benefits
Tier: free
Surfaces: Figma and React
Summary: A layout with a section header followed by a grid of equal-height cards.
Install: npx shadcn@latest add @shadcncraft/benefits-13
Page: https://shadcncraft.com/blocks/pro-marketing/benefits/benefits-13
Preview: https://shadcncraft.com/view/pro-marketing/blocks/benefits-13
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17859-91861

#### Blog Listings (4)

##### blog-listing-1
Name: Blog Listing 1
Kind: block
Archetype: Pro Marketing
Categories: blog-listings
Tier: pro
Surfaces: Figma and React
Summary: A responsive blog listing that highlights recent posts in a clean card grid.
Install: npx shadcn@latest add @shadcncraft/blog-listing-1
Page: https://shadcncraft.com/blocks/pro-marketing/blog-listings/blog-listing-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/blog-listing-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93013

##### blog-listing-2
Name: Blog Listing 2
Kind: block
Archetype: Pro Marketing
Categories: blog-listings
Tier: pro
Surfaces: Figma and React
Summary: A card-based blog layout with a clear section header and a progressive "Load more" pattern.
Install: npx shadcn@latest add @shadcncraft/blog-listing-2
Page: https://shadcncraft.com/blocks/pro-marketing/blog-listings/blog-listing-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/blog-listing-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93013

##### blog-listing-3
Name: Blog Listing 3
Kind: block
Archetype: Pro Marketing
Categories: blog-listings
Tier: pro
Surfaces: Figma and React
Summary: A blog layout anchored by a large featured post followed by a compact card grid.
Install: npx shadcn@latest add @shadcncraft/blog-listing-3
Page: https://shadcncraft.com/blocks/pro-marketing/blog-listings/blog-listing-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/blog-listing-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93013

##### blog-listing-4
Name: Blog Listing 4
Kind: block
Archetype: Pro Marketing
Categories: blog-listings
Tier: pro
Surfaces: Figma and React
Summary: A high-density card grid that surfaces many posts at once with equal visual weight.
Install: npx shadcn@latest add @shadcncraft/blog-listing-4
Page: https://shadcncraft.com/blocks/pro-marketing/blog-listings/blog-listing-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/blog-listing-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93013

#### Careers (5)

##### careers-1
Name: Careers 1
Kind: block
Archetype: Pro Marketing
Categories: careers
Tier: pro
Surfaces: Figma and React
Summary: A simple vertical job list focused on clarity and scannability.
Install: npx shadcn@latest add @shadcncraft/careers-1
Page: https://shadcncraft.com/blocks/pro-marketing/careers/careers-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/careers-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93769

##### careers-2
Name: Careers 2
Kind: block
Archetype: Pro Marketing
Categories: careers
Tier: pro
Surfaces: Figma and React
Summary: A split layout that pairs a job list with a large supporting image.
Install: npx shadcn@latest add @shadcncraft/careers-2
Page: https://shadcncraft.com/blocks/pro-marketing/careers/careers-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/careers-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93769

##### careers-3
Name: Careers 3
Kind: block
Archetype: Pro Marketing
Categories: careers
Tier: pro
Surfaces: Figma and React
Summary: A multi-column grid of role cards with consistent metadata and actions.
Install: npx shadcn@latest add @shadcncraft/careers-3
Page: https://shadcncraft.com/blocks/pro-marketing/careers/careers-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/careers-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93769

##### careers-4
Name: Careers 4
Kind: block
Archetype: Pro Marketing
Categories: careers
Tier: pro
Surfaces: Figma and React
Summary: A careers layout anchored by a large lifestyle image, followed by a clean vertical job list.
Install: npx shadcn@latest add @shadcncraft/careers-4
Page: https://shadcncraft.com/blocks/pro-marketing/careers/careers-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/careers-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93769

##### careers-5
Name: Careers 5
Kind: block
Archetype: Pro Marketing
Categories: careers
Tier: pro
Surfaces: Figma and React
Summary: A careers layout with a left-aligned intro and a dense, stacked job list alongside it.
Install: npx shadcn@latest add @shadcncraft/careers-5
Page: https://shadcncraft.com/blocks/pro-marketing/careers/careers-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/careers-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93769

#### Contact (11)

##### contact-1
Name: Contact 1
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: pro
Surfaces: Figma and React
Summary: A centered contact form with a clear headline and stacked inputs.
Install: npx shadcn@latest add @shadcncraft/contact-1
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93196

##### contact-2
Name: Contact 2
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: pro
Surfaces: Figma and React
Summary: A centered contact form wrapped in a card with clear visual boundaries.
Install: npx shadcn@latest add @shadcncraft/contact-2
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93196

##### contact-3
Name: Contact 3
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: pro
Surfaces: Figma and React
Summary: A two-column layout pairing a contact form with a large supporting image.
Install: npx shadcn@latest add @shadcncraft/contact-3
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93196

##### contact-4
Name: Contact 4
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: pro
Surfaces: Figma and React
Summary: A centered layout that surfaces multiple ways to get in touch without a form.
Install: npx shadcn@latest add @shadcncraft/contact-4
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93196

##### contact-5
Name: Contact 5
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: pro
Surfaces: Figma and React
Summary: A wide, visual-first layout that pairs a world map with key contact channels.
Install: npx shadcn@latest add @shadcncraft/contact-5
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93196

##### contact-6
Name: Contact 6
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: pro
Surfaces: Figma and React
Summary: A contact layout built around a large location map, with clear contact methods shown below and in a compact side panel.
Install: npx shadcn@latest add @shadcncraft/contact-6
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-6
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93196

##### contact-7
Name: Contact 7
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: pro
Surfaces: Figma and React
Summary: A contact layout anchored by a large, friendly image, with key contact options displayed clearly below and in a side panel.
Install: npx shadcn@latest add @shadcncraft/contact-7
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-7
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-7
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93196

##### contact-8
Name: Contact 8
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: pro
Surfaces: Figma and React
Summary: A contact layout that pairs a large, edge-to-edge image with stacked contact channels.
Install: npx shadcn@latest add @shadcncraft/contact-8
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-8
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-8
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93196

##### contact-9
Name: Contact 9
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: pro
Surfaces: Figma and React
Summary: A minimal contact block built around a single, centered call to action.
Install: npx shadcn@latest add @shadcncraft/contact-9
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-9
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-9
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93196

##### contact-10
Name: Contact 10
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: pro
Surfaces: Figma and React
Summary: A high-contrast contact block using a wide primary panel paired with a secondary sidebar.
Install: npx shadcn@latest add @shadcncraft/contact-10
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-10
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-10
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93196

##### contact-11
Name: Contact 11
Kind: block
Archetype: Pro Marketing
Categories: contact
Tier: free
Surfaces: Figma and React
Summary: A balanced contact layout with a primary, centered form and a secondary sidebar that mirrors or reinforces the same interaction.
Install: npx shadcn@latest add @shadcncraft/contact-11
Page: https://shadcncraft.com/blocks/pro-marketing/contact/contact-11
Preview: https://shadcncraft.com/view/pro-marketing/blocks/contact-11
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17859-93196

#### CTA (8)

##### cta-1
Name: CTA 1
Kind: block
Archetype: Pro Marketing
Categories: cta
Tier: pro
Surfaces: Figma and React
Summary: A centered call to action with a strong headline, short supporting copy, and side-by-side buttons.
Install: npx shadcn@latest add @shadcncraft/cta-1
Page: https://shadcncraft.com/blocks/pro-marketing/cta/cta-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/cta-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92345

##### cta-2
Name: CTA 2
Kind: block
Archetype: Pro Marketing
Categories: cta
Tier: pro
Surfaces: Figma and React
Summary: A left-aligned call to action with a strong headline, short supporting copy, and side-by-side buttons.
Install: npx shadcn@latest add @shadcncraft/cta-2
Page: https://shadcncraft.com/blocks/pro-marketing/cta/cta-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/cta-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92345

##### cta-3
Name: CTA 3
Kind: block
Archetype: Pro Marketing
Categories: cta
Tier: pro
Surfaces: Figma and React
Summary: A bold, high-contrast CTA presented inside a contained panel, with a centered headline and stacked primary and secondary actions.
Install: npx shadcn@latest add @shadcncraft/cta-3
Page: https://shadcncraft.com/blocks/pro-marketing/cta/cta-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/cta-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92345

##### cta-4
Name: CTA 4
Kind: block
Archetype: Pro Marketing
Categories: cta
Tier: pro
Surfaces: Figma and React
Summary: A wide, high-contrast CTA panel with left-aligned content and inline primary and secondary actions.
Install: npx shadcn@latest add @shadcncraft/cta-4
Page: https://shadcncraft.com/blocks/pro-marketing/cta/cta-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/cta-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92345

##### cta-5
Name: CTA 5
Kind: block
Archetype: Pro Marketing
Categories: cta
Tier: pro
Surfaces: Figma and React
Summary: A two-column CTA layout combining structured text and a visual panel.
Install: npx shadcn@latest add @shadcncraft/cta-5
Page: https://shadcncraft.com/blocks/pro-marketing/cta/cta-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/cta-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92345

##### cta-6
Name: CTA 6
Kind: block
Archetype: Pro Marketing
Categories: cta
Tier: pro
Surfaces: Figma and React
Summary: A split CTA layout anchored by a dominant visual panel, with supporting copy and a short feature list alongside.
Install: npx shadcn@latest add @shadcncraft/cta-6
Page: https://shadcncraft.com/blocks/pro-marketing/cta/cta-6
Preview: https://shadcncraft.com/view/pro-marketing/blocks/cta-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92345

##### cta-7
Name: CTA 7
Kind: block
Archetype: Pro Marketing
Categories: cta
Tier: pro
Surfaces: Figma and React
Summary: A split CTA layout that pairs structured copy and a short feature list with a live product preview or dashboard screenshot.
Install: npx shadcn@latest add @shadcncraft/cta-7
Page: https://shadcncraft.com/blocks/pro-marketing/cta/cta-7
Preview: https://shadcncraft.com/view/pro-marketing/blocks/cta-7
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92345

##### cta-8
Name: CTA 8
Kind: block
Archetype: Pro Marketing
Categories: cta
Tier: pro
Surfaces: Figma and React
Summary: A wide, left-aligned CTA paired with a large, offset product screenshot that bleeds toward the edge of the container.
Install: npx shadcn@latest add @shadcncraft/cta-8
Page: https://shadcncraft.com/blocks/pro-marketing/cta/cta-8
Preview: https://shadcncraft.com/view/pro-marketing/blocks/cta-8
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92345

#### FAQs (4)

##### faqs-1
Name: FAQ 1
Kind: block
Archetype: Pro Marketing
Categories: faqs
Tier: pro
Surfaces: Figma and React
Summary: Multi-column FAQ layout with short answers visible by default.
Install: npx shadcn@latest add @shadcncraft/faqs-1
Page: https://shadcncraft.com/blocks/pro-marketing/faqs/faqs-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/faqs-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93945

##### faqs-2
Name: FAQ 2
Kind: block
Archetype: Pro Marketing
Categories: faqs
Tier: pro
Surfaces: Figma and React
Summary: Single-column, centered accordion for longer answers.
Install: npx shadcn@latest add @shadcncraft/faqs-2
Page: https://shadcncraft.com/blocks/pro-marketing/faqs/faqs-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/faqs-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93945

##### faqs-3
Name: FAQ 3
Kind: block
Archetype: Pro Marketing
Categories: faqs
Tier: pro
Surfaces: Figma and React
Summary: A responsive FAQ section with a wide, centered accordion for desktop, plus a compact stacked version shown as a mobile preview.
Install: npx shadcn@latest add @shadcncraft/faqs-3
Page: https://shadcncraft.com/blocks/pro-marketing/faqs/faqs-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/faqs-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93945

##### faqs-4
Name: FAQ 4
Kind: block
Archetype: Pro Marketing
Categories: faqs
Tier: free
Surfaces: Figma and React
Summary: A clean, centered FAQ accordion paired with a narrow sidebar version.
Install: npx shadcn@latest add @shadcncraft/faqs-4
Page: https://shadcncraft.com/blocks/pro-marketing/faqs/faqs-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/faqs-4
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17859-93945

#### Footers (4)

##### footer-1
Name: Footer 1
Kind: block
Archetype: Pro Marketing
Categories: footers
Tier: pro
Surfaces: Figma and React
Summary: A wide, multi-column footer with grouped navigation links and a compact legal row.
Install: npx shadcn@latest add @shadcncraft/footer-1
Page: https://shadcncraft.com/blocks/pro-marketing/footers/footer-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/footer-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94192

##### footer-2
Name: Footer 2
Kind: block
Archetype: Pro Marketing
Categories: footers
Tier: pro
Surfaces: Figma and React
Summary: A multi-column sitemap footer with a prominent newsletter signup band.
Install: npx shadcn@latest add @shadcncraft/footer-2
Page: https://shadcncraft.com/blocks/pro-marketing/footers/footer-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/footer-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94192

##### footer-3
Name: Footer 3
Kind: block
Archetype: Pro Marketing
Categories: footers
Tier: pro
Surfaces: Figma and React
Summary: A clean, low-profile sitemap footer with evenly spaced link columns and a minimal brand and legal row.
Install: npx shadcn@latest add @shadcncraft/footer-3
Page: https://shadcncraft.com/blocks/pro-marketing/footers/footer-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/footer-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94192

##### footer-4
Name: Footer 4
Kind: block
Archetype: Pro Marketing
Categories: footers
Tier: free
Surfaces: Figma and React
Summary: A sitemap footer anchored by a short brand statement and logo, followed by structured link columns and legal links.
Install: npx shadcn@latest add @shadcncraft/footer-4
Page: https://shadcncraft.com/blocks/pro-marketing/footers/footer-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/footer-4
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17859-94192

#### Heroes (10)

##### hero-1
Name: Hero 1
Kind: block
Archetype: Pro Marketing
Categories: heroes
Tier: pro
Surfaces: Figma and React
Summary: A classic centered hero with a strong headline, short supporting copy, and a primary call to action.
Install: npx shadcn@latest add @shadcncraft/hero-1
Page: https://shadcncraft.com/blocks/pro-marketing/heroes/hero-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/hero-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107791

##### hero-2
Name: Hero 2
Kind: block
Archetype: Pro Marketing
Categories: heroes
Tier: pro
Surfaces: Figma and React
Summary: A bold, immersive hero that places the headline and call to action directly on a full-bleed visual background.
Install: npx shadcn@latest add @shadcncraft/hero-2
Page: https://shadcncraft.com/blocks/pro-marketing/heroes/hero-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/hero-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107791

##### hero-3
Name: Hero 3
Kind: block
Archetype: Pro Marketing
Categories: heroes
Tier: pro
Surfaces: Figma and React
Summary: A calm, airy hero that centers the headline and call to action over a soft, low-contrast background.
Install: npx shadcn@latest add @shadcncraft/hero-3
Page: https://shadcncraft.com/blocks/pro-marketing/heroes/hero-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/hero-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107791

##### hero-4
Name: Hero 4
Kind: block
Archetype: Pro Marketing
Categories: heroes
Tier: pro
Surfaces: Figma and React
Summary: A centered hero set on a subtle gradient background, using stacked CTAs to support different commitment levels.
Install: npx shadcn@latest add @shadcncraft/hero-4
Page: https://shadcncraft.com/blocks/pro-marketing/heroes/hero-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/hero-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107791

##### hero-5
Name: Hero 5
Kind: block
Archetype: Pro Marketing
Categories: heroes
Tier: pro
Surfaces: Figma and React
Summary: A balanced split hero that pairs left-aligned messaging with a strong visual on the right.
Install: npx shadcn@latest add @shadcncraft/hero-5
Page: https://shadcncraft.com/blocks/pro-marketing/heroes/hero-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/hero-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107791

##### hero-6
Name: Hero 6
Kind: block
Archetype: Pro Marketing
Categories: heroes
Tier: pro
Surfaces: Figma and React
Summary: A practical split hero that pairs a strong visual with a short benefits list.
Install: npx shadcn@latest add @shadcncraft/hero-6
Page: https://shadcncraft.com/blocks/pro-marketing/heroes/hero-6
Preview: https://shadcncraft.com/view/pro-marketing/blocks/hero-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107791

##### hero-7
Name: Hero 7
Kind: block
Archetype: Pro Marketing
Categories: heroes
Tier: pro
Surfaces: Figma and React
Summary: A narrative-led hero that explains the problem before selling the solution.
Install: npx shadcn@latest add @shadcncraft/hero-7
Page: https://shadcncraft.com/blocks/pro-marketing/heroes/hero-7
Preview: https://shadcncraft.com/view/pro-marketing/blocks/hero-7
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107791

##### hero-8
Name: Hero 8
Kind: block
Archetype: Pro Marketing
Categories: heroes
Tier: pro
Surfaces: Figma and React
Summary: A stripped-back hero for secondary pages.
Install: npx shadcn@latest add @shadcncraft/hero-8
Page: https://shadcncraft.com/blocks/pro-marketing/heroes/hero-8
Preview: https://shadcncraft.com/view/pro-marketing/blocks/hero-8
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107791

##### hero-9
Name: Hero 9
Kind: block
Archetype: Pro Marketing
Categories: heroes
Tier: pro
Surfaces: Figma and React
Summary: A balanced hero that pairs a clear page title and primary actions with a strong supporting image.
Install: npx shadcn@latest add @shadcncraft/hero-9
Page: https://shadcncraft.com/blocks/pro-marketing/heroes/hero-9
Preview: https://shadcncraft.com/view/pro-marketing/blocks/hero-9
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107791

##### hero-10
Name: Hero 10
Kind: block
Archetype: Pro Marketing
Categories: heroes
Tier: pro
Surfaces: Figma and React
Summary: A bold, image-led hero with text overlaid on photography.
Install: npx shadcn@latest add @shadcncraft/hero-10
Page: https://shadcncraft.com/blocks/pro-marketing/heroes/hero-10
Preview: https://shadcncraft.com/view/pro-marketing/blocks/hero-10
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107791

#### Metrics (7)

##### metrics-1
Name: Metrics 1
Kind: block
Archetype: Pro Marketing
Categories: metrics
Tier: pro
Surfaces: Figma and React
Summary: A horizontally distributed metrics layout that pairs large headline numbers with short labels, anchored by a subtle world map background.
Install: npx shadcn@latest add @shadcncraft/metrics-1
Page: https://shadcncraft.com/blocks/pro-marketing/metrics/metrics-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/metrics-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92526

##### metrics-2
Name: Metrics 2
Kind: block
Archetype: Pro Marketing
Categories: metrics
Tier: pro
Surfaces: Figma and React
Summary: A metrics layout built around a strong centered heading, followed by evenly spaced stat columns with short supporting labels and optional inline links.
Install: npx shadcn@latest add @shadcncraft/metrics-2
Page: https://shadcncraft.com/blocks/pro-marketing/metrics/metrics-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/metrics-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92526

##### metrics-3
Name: Metrics 3
Kind: block
Archetype: Pro Marketing
Categories: metrics
Tier: pro
Surfaces: Figma and React
Summary: A two-column metrics layout that pairs a text-led stats group with a strong visual anchor.
Install: npx shadcn@latest add @shadcncraft/metrics-3
Page: https://shadcncraft.com/blocks/pro-marketing/metrics/metrics-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/metrics-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92526

##### metrics-4
Name: Metrics 4
Kind: block
Archetype: Pro Marketing
Categories: metrics
Tier: pro
Surfaces: Figma and React
Summary: A symmetric metrics layout built around a centered headline and a single horizontal row of key stats.
Install: npx shadcn@latest add @shadcncraft/metrics-4
Page: https://shadcncraft.com/blocks/pro-marketing/metrics/metrics-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/metrics-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92526

##### metrics-5
Name: Metrics 5
Kind: block
Archetype: Pro Marketing
Categories: metrics
Tier: pro
Surfaces: Figma and React
Summary: A metrics layout where each stat is wrapped in a lightweight card.
Install: npx shadcn@latest add @shadcncraft/metrics-5
Page: https://shadcncraft.com/blocks/pro-marketing/metrics/metrics-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/metrics-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92526

##### metrics-6
Name: Metrics 6
Kind: block
Archetype: Pro Marketing
Categories: metrics
Tier: pro
Surfaces: Figma and React
Summary: A single-row metrics layout that uses subtle vertical dividers instead of cards.
Install: npx shadcn@latest add @shadcncraft/metrics-6
Page: https://shadcncraft.com/blocks/pro-marketing/metrics/metrics-6
Preview: https://shadcncraft.com/view/pro-marketing/blocks/metrics-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92526

##### metrics-7
Name: Metrics 7
Kind: block
Archetype: Pro Marketing
Categories: metrics
Tier: pro
Surfaces: Figma and React
Summary: A centered section header paired with a single horizontal row of key stats.
Install: npx shadcn@latest add @shadcncraft/metrics-7
Page: https://shadcncraft.com/blocks/pro-marketing/metrics/metrics-7
Preview: https://shadcncraft.com/view/pro-marketing/blocks/metrics-7
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92526

#### Newsletter Signup (5)

##### newsletter-signup-1
Name: Newsletter Signup 1
Kind: block
Archetype: Pro Marketing
Categories: newsletter-signup
Tier: pro
Surfaces: Figma and React
Summary: A newsletter signup pattern that pairs a simple email capture with a strong visual anchor.
Install: npx shadcn@latest add @shadcncraft/newsletter-signup-1
Page: https://shadcncraft.com/blocks/pro-marketing/newsletter-signup/newsletter-signup-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/newsletter-signup-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107882

##### newsletter-signup-2
Name: Newsletter Signup 2
Kind: block
Archetype: Pro Marketing
Categories: newsletter-signup
Tier: pro
Surfaces: Figma and React
Summary: A newsletter signup pattern that leads with clear value before the email field.
Install: npx shadcn@latest add @shadcncraft/newsletter-signup-2
Page: https://shadcncraft.com/blocks/pro-marketing/newsletter-signup/newsletter-signup-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/newsletter-signup-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107882

##### newsletter-signup-3
Name: Newsletter Signup 3
Kind: block
Archetype: Pro Marketing
Categories: newsletter-signup
Tier: pro
Surfaces: Figma and React
Summary: A compact newsletter signup pattern that places the email field inline with the headline.
Install: npx shadcn@latest add @shadcncraft/newsletter-signup-3
Page: https://shadcncraft.com/blocks/pro-marketing/newsletter-signup/newsletter-signup-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/newsletter-signup-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107882

##### newsletter-signup-4
Name: Newsletter Signup 4
Kind: block
Archetype: Pro Marketing
Categories: newsletter-signup
Tier: pro
Surfaces: Figma and React
Summary: A centered newsletter signup pattern that emphasizes balance and clarity.
Install: npx shadcn@latest add @shadcncraft/newsletter-signup-4
Page: https://shadcncraft.com/blocks/pro-marketing/newsletter-signup/newsletter-signup-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/newsletter-signup-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107882

##### newsletter-signup-5
Name: Newsletter Signup 5
Kind: block
Archetype: Pro Marketing
Categories: newsletter-signup
Tier: free
Surfaces: Figma and React
Summary: A horizontal newsletter signup pattern presented inside a soft container to separate it from surrounding content.
Install: npx shadcn@latest add @shadcncraft/newsletter-signup-5
Page: https://shadcncraft.com/blocks/pro-marketing/newsletter-signup/newsletter-signup-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/newsletter-signup-5
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17936-107882

#### Pricing (7)

##### pricing-1
Name: Pricing 1
Kind: block
Archetype: Pro Marketing
Categories: pricing
Tier: pro
Surfaces: Figma and React
Summary: A classic three-column pricing layout with equal-weight plan cards for easy comparison.
Install: npx shadcn@latest add @shadcncraft/pricing-1
Page: https://shadcncraft.com/blocks/pro-marketing/pricing/pricing-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/pricing-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92210

##### pricing-2
Name: Pricing 2
Kind: block
Archetype: Pro Marketing
Categories: pricing
Tier: pro
Surfaces: Figma and React
Summary: A simplified pricing layout that presents two plans side by side to reduce choice overload.
Install: npx shadcn@latest add @shadcncraft/pricing-2
Page: https://shadcncraft.com/blocks/pro-marketing/pricing/pricing-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/pricing-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92210

##### pricing-3
Name: Pricing 3
Kind: block
Archetype: Pro Marketing
Categories: pricing
Tier: pro
Surfaces: Figma and React
Summary: A centered, single-card pricing layout that puts all attention on one plan.
Install: npx shadcn@latest add @shadcncraft/pricing-3
Page: https://shadcncraft.com/blocks/pro-marketing/pricing/pricing-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/pricing-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92210

##### pricing-4
Name: Pricing 4
Kind: block
Archetype: Pro Marketing
Categories: pricing
Tier: pro
Surfaces: Figma and React
Summary: A classic three-tier pricing layout with a clearly emphasized middle plan to guide choice.
Install: npx shadcn@latest add @shadcncraft/pricing-4
Page: https://shadcncraft.com/blocks/pro-marketing/pricing/pricing-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/pricing-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92210

##### pricing-5
Name: Pricing 5
Kind: block
Archetype: Pro Marketing
Categories: pricing
Tier: pro
Surfaces: Figma and React
Summary: A two-plan layout where one option is visually emphasized through stronger borders and hierarchy, even when the plans are similar.
Install: npx shadcn@latest add @shadcncraft/pricing-5
Page: https://shadcncraft.com/blocks/pro-marketing/pricing/pricing-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/pricing-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92210

##### pricing-6
Name: Pricing 6
Kind: block
Archetype: Pro Marketing
Categories: pricing
Tier: pro
Surfaces: Figma and React
Summary: A minimal pricing pattern that centers on a single plan, removing comparison to reduce decision friction.
Install: npx shadcn@latest add @shadcncraft/pricing-6
Page: https://shadcncraft.com/blocks/pro-marketing/pricing/pricing-6
Preview: https://shadcncraft.com/view/pro-marketing/blocks/pricing-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92210

##### pricing-7
Name: Pricing 7
Kind: block
Archetype: Pro Marketing
Categories: pricing
Tier: pro
Surfaces: Figma and React
Summary: A dense pricing pattern that pairs plans with a side-by-side feature matrix.
Install: npx shadcn@latest add @shadcncraft/pricing-7
Page: https://shadcncraft.com/blocks/pro-marketing/pricing/pricing-7
Preview: https://shadcncraft.com/view/pro-marketing/blocks/pricing-7
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-92210

#### Social Proof (6)

##### social-proof-1
Name: Social Proof 1
Kind: block
Archetype: Pro Marketing
Categories: social-proof
Tier: pro
Surfaces: Figma and React
Summary: A minimal social proof pattern that presents partner or customer logos in a single horizontal row.
Install: npx shadcn@latest add @shadcncraft/social-proof-1
Page: https://shadcncraft.com/blocks/pro-marketing/social-proof/social-proof-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/social-proof-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107974

##### social-proof-2
Name: Social Proof 2
Kind: block
Archetype: Pro Marketing
Categories: social-proof
Tier: pro
Surfaces: Figma and React
Summary: A horizontally scrolling logo strip that loops automatically.
Install: npx shadcn@latest add @shadcncraft/social-proof-2
Page: https://shadcncraft.com/blocks/pro-marketing/social-proof/social-proof-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/social-proof-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107974

##### social-proof-3
Name: Social Proof 3
Kind: block
Archetype: Pro Marketing
Categories: social-proof
Tier: pro
Surfaces: Figma and React
Summary: A static row of full-color logos.
Install: npx shadcn@latest add @shadcncraft/social-proof-3
Page: https://shadcncraft.com/blocks/pro-marketing/social-proof/social-proof-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/social-proof-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107974

##### social-proof-4
Name: Social Proof 4
Kind: block
Archetype: Pro Marketing
Categories: social-proof
Tier: pro
Surfaces: Figma and React
Summary: A compact logo row paired with a short trust line.
Install: npx shadcn@latest add @shadcncraft/social-proof-4
Page: https://shadcncraft.com/blocks/pro-marketing/social-proof/social-proof-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/social-proof-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107974

##### social-proof-5
Name: Social Proof 5
Kind: block
Archetype: Pro Marketing
Categories: social-proof
Tier: pro
Surfaces: Figma and React
Summary: A logo strip paired with a strong visual.
Install: npx shadcn@latest add @shadcncraft/social-proof-5
Page: https://shadcncraft.com/blocks/pro-marketing/social-proof/social-proof-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/social-proof-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107974

##### social-proof-6
Name: Social Proof 6
Kind: block
Archetype: Pro Marketing
Categories: social-proof
Tier: pro
Surfaces: Figma and React
Summary: Centered headline with a strict, even grid below.
Install: npx shadcn@latest add @shadcncraft/social-proof-6
Page: https://shadcncraft.com/blocks/pro-marketing/social-proof/social-proof-6
Preview: https://shadcncraft.com/view/pro-marketing/blocks/social-proof-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-107974

#### Team (5)

##### team-1
Name: Team 1
Kind: block
Archetype: Pro Marketing
Categories: team
Tier: pro
Surfaces: Figma and React
Summary: A centered section with a clear headline and supporting line, followed by an evenly spaced grid of profile tiles.
Install: npx shadcn@latest add @shadcncraft/team-1
Page: https://shadcncraft.com/blocks/pro-marketing/team/team-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/team-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93589

##### team-2
Name: Team 2
Kind: block
Archetype: Pro Marketing
Categories: team
Tier: pro
Surfaces: Figma and React
Summary: A two-column layout where a compact intro block anchors the section on the left while a dense, evenly spaced avatar grid fills the remaining width.
Install: npx shadcn@latest add @shadcncraft/team-2
Page: https://shadcncraft.com/blocks/pro-marketing/team/team-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/team-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93589

##### team-3
Name: Team 3
Kind: block
Archetype: Pro Marketing
Categories: team
Tier: pro
Surfaces: Figma and React
Summary: Team 3 – Mixed-shape avatar mosaic
Install: npx shadcn@latest add @shadcncraft/team-3
Page: https://shadcncraft.com/blocks/pro-marketing/team/team-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/team-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93589

##### team-4
Name: Team 4
Kind: block
Archetype: Pro Marketing
Categories: team
Tier: pro
Surfaces: Figma and React
Summary: A split layout that pairs large, candid team photos with a clean, tabular roster below.
Install: npx shadcn@latest add @shadcncraft/team-4
Page: https://shadcncraft.com/blocks/pro-marketing/team/team-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/team-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93589

##### team-5
Name: Team 5
Kind: block
Archetype: Pro Marketing
Categories: team
Tier: pro
Surfaces: Figma and React
Summary: A gallery-style layout built around large, consistent portrait cards with subtle overlays.
Install: npx shadcn@latest add @shadcncraft/team-5
Page: https://shadcncraft.com/blocks/pro-marketing/team/team-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/team-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-93589

#### Testimonials (11)

##### testimonials-1
Name: Testimonial 1
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: pro
Surfaces: Figma and React
Summary: A centered, long-form testimonial designed to feel calm and authoritative.
Install: npx shadcn@latest add @shadcncraft/testimonials-1
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-108064

##### testimonials-2
Name: Testimonial 2
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: pro
Surfaces: Figma and React
Summary: A minimal, centered testimonial layout that tightens the hierarchy around the quote and author.
Install: npx shadcn@latest add @shadcncraft/testimonials-2
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-108064

##### testimonials-3
Name: Testimonial 3
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: pro
Surfaces: Figma and React
Summary: Testimonial 3 – Split quote with featured profile
Install: npx shadcn@latest add @shadcncraft/testimonials-3
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-108064

##### testimonials-4
Name: Testimonial 4
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: pro
Surfaces: Figma and React
Summary: A bold split layout that gives equal weight to a large portrait and the testimonial copy.
Install: npx shadcn@latest add @shadcncraft/testimonials-4
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-108064

##### testimonials-5
Name: Testimonial 5
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: pro
Surfaces: Figma and React
Summary: A carousel-style testimonial where the quote and controls sit in a fixed text column, paired with layered image cards that suggest depth and progression.
Install: npx shadcn@latest add @shadcncraft/testimonials-5
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-108064

##### testimonials-6
Name: Testimonial 6
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: pro
Surfaces: Figma and React
Summary: A split testimonial layout with the quote anchored in a static text column and a horizontal carousel of large profile cards running alongside it.
Install: npx shadcn@latest add @shadcncraft/testimonials-6
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-6
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-108064

##### testimonials-7
Name: Testimonial 7
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: pro
Surfaces: Figma and React
Summary: A testimonial layout that leads with a strong headline and brand marker, followed by a dense grid of profile cards.
Install: npx shadcn@latest add @shadcncraft/testimonials-7
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-7
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-7
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-108064

##### testimonials-8
Name: Testimonial 8
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: pro
Surfaces: Figma and React
Summary: A testimonial layout that anchors on a long-form quote with clear brand attribution, then reinforces credibility using a horizontal strip of individual profiles.
Install: npx shadcn@latest add @shadcncraft/testimonials-8
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-8
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-8
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-108064

##### testimonials-9
Name: Testimonial 9
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: pro
Surfaces: Figma and React
Summary: A testimonial layout built around small, self-contained story cards, each representing a different team or use case.
Install: npx shadcn@latest add @shadcncraft/testimonials-9
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-9
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-9
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-108064

##### testimonials-10
Name: Testimonial 10
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: pro
Surfaces: Figma and React
Summary: A compact testimonial layout that surfaces many short quotes at once using a uniform card grid.
Install: npx shadcn@latest add @shadcncraft/testimonials-10
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-10
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-10
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17936-108064

##### testimonials-11
Name: Testimonial 11
Kind: block
Archetype: Pro Marketing
Categories: testimonials
Tier: free
Surfaces: Figma and React
Summary: A structured testimonial layout that combines a clear section header with a multi-column grid of short quotes.
Install: npx shadcn@latest add @shadcncraft/testimonials-11
Page: https://shadcncraft.com/blocks/pro-marketing/testimonials/testimonials-11
Preview: https://shadcncraft.com/view/pro-marketing/blocks/testimonials-11
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17936-108064

#### Top Navigation (5)

##### top-navigation-1
Name: Top Navigation 1
Kind: block
Archetype: Pro Marketing
Categories: top-navigation
Tier: pro
Surfaces: Figma and React
Summary: A classic left-aligned top navigation with horizontal links and inline dropdown menus for larger screens.
Install: npx shadcn@latest add @shadcncraft/top-navigation-1
Page: https://shadcncraft.com/blocks/pro-marketing/top-navigation/top-navigation-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/top-navigation-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=14088-52274

##### top-navigation-2
Name: Top Navigation 2
Kind: block
Archetype: Pro Marketing
Categories: top-navigation
Tier: pro
Surfaces: Figma and React
Summary: A center-aligned top navigation that places the primary links in the middle of the header, creating a more balanced, symmetrical layout.
Install: npx shadcn@latest add @shadcncraft/top-navigation-2
Page: https://shadcncraft.com/blocks/pro-marketing/top-navigation/top-navigation-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/top-navigation-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=14088-52274

##### top-navigation-3
Name: Top Navigation 3
Kind: block
Archetype: Pro Marketing
Categories: top-navigation
Tier: pro
Surfaces: Figma and React
Summary: A compact top navigation that keeps the large-screen layout minimal and low-profile, with primary links arranged in a single horizontal bar.
Install: npx shadcn@latest add @shadcncraft/top-navigation-3
Page: https://shadcncraft.com/blocks/pro-marketing/top-navigation/top-navigation-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/top-navigation-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=14088-52274

##### top-navigation-4
Name: Top Navigation 4
Kind: block
Archetype: Pro Marketing
Categories: top-navigation
Tier: pro
Surfaces: Figma and React
Summary: A centered top navigation where primary links sit inside a pill-style container, creating a strong visual anchor across large screens.
Install: npx shadcn@latest add @shadcncraft/top-navigation-4
Page: https://shadcncraft.com/blocks/pro-marketing/top-navigation/top-navigation-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/top-navigation-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=14088-52274

##### top-navigation-5
Name: Top Navigation 5
Kind: block
Archetype: Pro Marketing
Categories: top-navigation
Tier: free
Surfaces: Figma and React
Summary: A stripped-back, center-aligned top navigation that prioritizes clarity and whitespace.
Install: npx shadcn@latest add @shadcncraft/top-navigation-5
Page: https://shadcncraft.com/blocks/pro-marketing/top-navigation/top-navigation-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/top-navigation-5
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=14088-52274

#### 404 (6)

##### 404-1
Name: 404 1
Kind: block
Archetype: Pro Marketing
Categories: 404
Tier: pro
Surfaces: Figma and React
Summary: A clean and centered error page design for handling "Page not found" scenarios.
Install: npx shadcn@latest add @shadcncraft/404-1
Page: https://shadcncraft.com/blocks/pro-marketing/404/404-1
Preview: https://shadcncraft.com/view/pro-marketing/blocks/404-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=89208-12904

##### 404-2
Name: 404 2
Kind: block
Archetype: Pro Marketing
Categories: 404
Tier: pro
Surfaces: Figma and React
Summary: A modern and emotionally engaging error page that uses a split-screen composition.
Install: npx shadcn@latest add @shadcncraft/404-2
Page: https://shadcncraft.com/blocks/pro-marketing/404/404-2
Preview: https://shadcncraft.com/view/pro-marketing/blocks/404-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=89208-13294

##### 404-3
Name: 404 3
Kind: block
Archetype: Pro Marketing
Categories: 404
Tier: pro
Surfaces: Figma and React
Summary: A comprehensive error recovery page designed to provide immediate assistance.
Install: npx shadcn@latest add @shadcncraft/404-3
Page: https://shadcncraft.com/blocks/pro-marketing/404/404-3
Preview: https://shadcncraft.com/view/pro-marketing/blocks/404-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=89208-66777

##### 404-4
Name: 404 4
Kind: block
Archetype: Pro Marketing
Categories: 404
Tier: pro
Surfaces: Figma and React
Summary: A creative balanced error page that uses a custom illustration to communicate a technical disconnect.
Install: npx shadcn@latest add @shadcncraft/404-4
Page: https://shadcncraft.com/blocks/pro-marketing/404/404-4
Preview: https://shadcncraft.com/view/pro-marketing/blocks/404-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=89208-67214

##### 404-5
Name: 404 5
Kind: block
Archetype: Pro Marketing
Categories: 404
Tier: pro
Surfaces: Figma and React
Summary: A highly functional error page that utilizes a balanced grid system.
Install: npx shadcn@latest add @shadcncraft/404-5
Page: https://shadcncraft.com/blocks/pro-marketing/404/404-5
Preview: https://shadcncraft.com/view/pro-marketing/blocks/404-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=89208-68342

##### 404-6
Name: 404 6
Kind: block
Archetype: Pro Marketing
Categories: 404
Tier: pro
Surfaces: Figma and React
Summary: A modern error page that utilizes an inverted split-screen layout.
Install: npx shadcn@latest add @shadcncraft/404-6
Page: https://shadcncraft.com/blocks/pro-marketing/404/404-6
Preview: https://shadcncraft.com/view/pro-marketing/blocks/404-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=89208-69186

### Pro Application (48 blocks)

#### Activity Feed (1)

##### activity-feed-1
Name: Activity Feed 1
Kind: block
Archetype: Pro Application
Categories: activity-feed
Tier: pro
Surfaces: Figma and React
Summary: A chronological activity feed presented as a vertical timeline, combining user avatars, action summaries, and timestamps for quick scanning.
Install: npx shadcn@latest add @shadcncraft/activity-feed-1
Page: https://shadcncraft.com/blocks/pro-application/activity-feed/activity-feed-1
Preview: https://shadcncraft.com/view/pro-application/blocks/activity-feed-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50338-23362

#### File Uploads (3)

##### file-upload-1
Name: File Upload 1
Kind: block
Archetype: Pro Application
Categories: file-uploads
Tier: pro
Surfaces: Figma and React
Summary: A compact file upload layout with a prominent drag-and-drop zone and clear fallback action.
Install: npx shadcn@latest add @shadcncraft/file-upload-1
Page: https://shadcncraft.com/blocks/pro-application/file-uploads/file-upload-1
Preview: https://shadcncraft.com/view/pro-application/blocks/file-upload-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50226-16524

##### file-upload-2
Name: File Upload 2
Kind: block
Archetype: Pro Application
Categories: file-uploads
Tier: pro
Surfaces: Figma and React
Summary: A streamlined file upload layout that pairs a drag-and-drop zone with a clean, minimal upload list.
Install: npx shadcn@latest add @shadcncraft/file-upload-2
Page: https://shadcncraft.com/blocks/pro-application/file-uploads/file-upload-2
Preview: https://shadcncraft.com/view/pro-application/blocks/file-upload-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50226-16524

##### file-upload-3
Name: File Upload 3
Kind: block
Archetype: Pro Application
Categories: file-uploads
Tier: pro
Surfaces: Figma and React
Summary: A structured file upload layout that separates completed and in-progress uploads into clear sections.
Install: npx shadcn@latest add @shadcncraft/file-upload-3
Page: https://shadcncraft.com/blocks/pro-application/file-uploads/file-upload-3
Preview: https://shadcncraft.com/view/pro-application/blocks/file-upload-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50226-16524

#### Headers (6)

##### header-1
Name: Header 1
Kind: block
Archetype: Pro Application
Categories: headers
Tier: pro
Surfaces: Figma and React
Summary: A standard page header that anchors the page title with optional breadcrumbs, primary actions, and inline search.
Install: npx shadcn@latest add @shadcncraft/header-1
Page: https://shadcncraft.com/blocks/pro-application/headers/header-1
Preview: https://shadcncraft.com/view/pro-application/blocks/header-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=46226-41255

##### header-2
Name: Header 2
Kind: block
Archetype: Pro Application
Categories: headers
Tier: pro
Surfaces: Figma and React
Summary: A page header that pairs a visual cover with navigation context and search.
Install: npx shadcn@latest add @shadcncraft/header-2
Page: https://shadcncraft.com/blocks/pro-application/headers/header-2
Preview: https://shadcncraft.com/view/pro-application/blocks/header-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=46226-41255

##### header-3
Name: Header 3
Kind: block
Archetype: Pro Application
Categories: headers
Tier: pro
Surfaces: Figma and React
Summary: A compact page header that combines breadcrumbs, a clear page title, and inline tabs for switching between related sections.
Install: npx shadcn@latest add @shadcncraft/header-3
Page: https://shadcncraft.com/blocks/pro-application/headers/header-3
Preview: https://shadcncraft.com/view/pro-application/blocks/header-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=46226-41255

##### header-4
Name: Header 4
Kind: block
Archetype: Pro Application
Categories: headers
Tier: pro
Surfaces: Figma and React
Summary: A richer page header that pairs breadcrumbs and a page title with a visual cover image and inline tabs.
Install: npx shadcn@latest add @shadcncraft/header-4
Page: https://shadcncraft.com/blocks/pro-application/headers/header-4
Preview: https://shadcncraft.com/view/pro-application/blocks/header-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=46226-41255

##### header-5
Name: Header 5
Kind: block
Archetype: Pro Application
Categories: headers
Tier: pro
Surfaces: Figma and React
Summary: A compact header designed for user or account pages.
Install: npx shadcn@latest add @shadcncraft/header-5
Page: https://shadcncraft.com/blocks/pro-application/headers/header-5
Preview: https://shadcncraft.com/view/pro-application/blocks/header-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=46226-41255

##### header-6
Name: Header 6
Kind: block
Archetype: Pro Application
Categories: headers
Tier: pro
Surfaces: Figma and React
Summary: A lightweight page header that pairs a clear title with a short supporting description.
Install: npx shadcn@latest add @shadcncraft/header-6
Page: https://shadcncraft.com/blocks/pro-application/headers/header-6
Preview: https://shadcncraft.com/view/pro-application/blocks/header-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=46226-41255

#### Inline CTA (3)

##### inline-cta-1
Name: Inline CTA 1
Kind: block
Archetype: Pro Application
Categories: inline-cta
Tier: pro
Surfaces: Figma and React
Summary: A small, inline call to action that pairs a short title and description with one or two buttons.
Install: npx shadcn@latest add @shadcncraft/inline-cta-1
Page: https://shadcncraft.com/blocks/pro-application/inline-cta/inline-cta-1
Preview: https://shadcncraft.com/view/pro-application/blocks/inline-cta-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=51130-49444

##### inline-cta-2
Name: Inline CTA 2
Kind: block
Archetype: Pro Application
Categories: inline-cta
Tier: pro
Surfaces: Figma and React
Summary: An inline call to action that pairs a visual with a short title and description to add context and emotional weight.
Install: npx shadcn@latest add @shadcncraft/inline-cta-2
Page: https://shadcncraft.com/blocks/pro-application/inline-cta/inline-cta-2
Preview: https://shadcncraft.com/view/pro-application/blocks/inline-cta-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=51130-49444

##### inline-cta-3
Name: Inline CTA 3
Kind: block
Archetype: Pro Application
Categories: inline-cta
Tier: pro
Surfaces: Figma and React
Summary: An inline call to action designed for simple email capture.
Install: npx shadcn@latest add @shadcncraft/inline-cta-3
Page: https://shadcncraft.com/blocks/pro-application/inline-cta/inline-cta-3
Preview: https://shadcncraft.com/view/pro-application/blocks/inline-cta-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=51130-49444

#### Modals (3)

##### modal-1
Name: Modal 1
Kind: block
Archetype: Pro Application
Categories: modals
Tier: pro
Surfaces: Figma and React
Summary: A centered modal with a fixed width and clear visual separation from the page using a dimmed backdrop.
Install: npx shadcn@latest add @shadcncraft/modal-1
Page: https://shadcncraft.com/blocks/pro-application/modals/modal-1
Preview: https://shadcncraft.com/view/pro-application/blocks/modal-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50120-16691

##### modal-2
Name: Modal 2
Kind: block
Archetype: Pro Application
Categories: modals
Tier: pro
Surfaces: Figma and React
Summary: A centered dialog modal with a dimmed backdrop, similar in structure to Modal 1 but visually weighted toward caution.
Install: npx shadcn@latest add @shadcncraft/modal-2
Page: https://shadcncraft.com/blocks/pro-application/modals/modal-2
Preview: https://shadcncraft.com/view/pro-application/blocks/modal-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50120-16691

##### modal-3
Name: Modal 3
Kind: block
Archetype: Pro Application
Categories: modals
Tier: pro
Surfaces: Figma and React
Summary: A centered, medium-width modal designed specifically for sign-in flows.
Install: npx shadcn@latest add @shadcncraft/modal-3
Page: https://shadcncraft.com/blocks/pro-application/modals/modal-3
Preview: https://shadcncraft.com/view/pro-application/blocks/modal-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50120-16691

#### Multistep (3)

##### multistep-1
Name: Multistep 1
Kind: block
Archetype: Pro Application
Categories: multistep
Tier: pro
Surfaces: Figma and React
Summary: A wide, two-column layout that pairs the active step with clear progress context.
Install: npx shadcn@latest add @shadcncraft/multistep-1
Page: https://shadcncraft.com/blocks/pro-application/multistep/multistep-1
Preview: https://shadcncraft.com/view/pro-application/blocks/multistep-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50477-77785

##### multistep-2
Name: Multistep 2
Kind: block
Archetype: Pro Application
Categories: multistep
Tier: pro
Surfaces: Figma and React
Summary: A three-column composition that blends form, visual, and progress.
Install: npx shadcn@latest add @shadcncraft/multistep-2
Page: https://shadcncraft.com/blocks/pro-application/multistep/multistep-2
Preview: https://shadcncraft.com/view/pro-application/blocks/multistep-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50477-77785

##### multistep-3
Name: Multistep 3
Kind: block
Archetype: Pro Application
Categories: multistep
Tier: pro
Surfaces: Figma and React
Summary: A strong two-panel layout that leans editorial.
Install: npx shadcn@latest add @shadcncraft/multistep-3
Page: https://shadcncraft.com/blocks/pro-application/multistep/multistep-3
Preview: https://shadcncraft.com/view/pro-application/blocks/multistep-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50477-77785

#### Progress (4)

##### progress-1
Name: Progress 1
Kind: block
Archetype: Pro Application
Categories: progress
Tier: pro
Surfaces: Figma and React
Summary: A clean, linear progress bar that spreads steps evenly across the page.
Install: npx shadcn@latest add @shadcncraft/progress-1
Page: https://shadcncraft.com/blocks/pro-application/progress/progress-1
Preview: https://shadcncraft.com/view/pro-application/blocks/progress-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50386-40994

##### progress-2
Name: Progress 2
Kind: block
Archetype: Pro Application
Categories: progress
Tier: pro
Surfaces: Figma and React
Summary: A stacked, vertical progress pattern with numbered steps aligned to a single axis.
Install: npx shadcn@latest add @shadcncraft/progress-2
Page: https://shadcncraft.com/blocks/pro-application/progress/progress-2
Preview: https://shadcncraft.com/view/pro-application/blocks/progress-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50386-40994

##### progress-3
Name: Progress 3
Kind: block
Archetype: Pro Application
Categories: progress
Tier: pro
Surfaces: Figma and React
Summary: A horizontal stepper that shows progress at a glance.
Install: npx shadcn@latest add @shadcncraft/progress-3
Page: https://shadcncraft.com/blocks/pro-application/progress/progress-3
Preview: https://shadcncraft.com/view/pro-application/blocks/progress-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50386-40994

##### progress-4
Name: Progress 4
Kind: block
Archetype: Pro Application
Categories: progress
Tier: pro
Surfaces: Figma and React
Summary: A vertical step list with all steps shown as completed.
Install: npx shadcn@latest add @shadcncraft/progress-4
Page: https://shadcncraft.com/blocks/pro-application/progress/progress-4
Preview: https://shadcncraft.com/view/pro-application/blocks/progress-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50386-40994

#### Section Footers (4)

##### section-footer-1
Name: Section Footer 1
Kind: block
Archetype: Pro Application
Categories: section-footers
Tier: pro
Surfaces: Figma and React
Summary: A compact footer layout built around a single horizontal row of lightweight links paired with a small set of primary actions.
Install: npx shadcn@latest add @shadcncraft/section-footer-1
Page: https://shadcncraft.com/blocks/pro-application/section-footers/section-footer-1
Preview: https://shadcncraft.com/view/pro-application/blocks/section-footer-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50291-7185

##### section-footer-2
Name: Section Footer 2
Kind: block
Archetype: Pro Application
Categories: section-footers
Tier: pro
Surfaces: Figma and React
Summary: A stripped-back footer built around a single, prominent action rather than navigation.
Install: npx shadcn@latest add @shadcncraft/section-footer-2
Page: https://shadcncraft.com/blocks/pro-application/section-footers/section-footer-2
Preview: https://shadcncraft.com/view/pro-application/blocks/section-footer-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50291-7185

##### section-footer-3
Name: Section Footer 3
Kind: block
Archetype: Pro Application
Categories: section-footers
Tier: pro
Surfaces: Figma and React
Summary: A functional footer layout that combines secondary actions with an inline utility element.
Install: npx shadcn@latest add @shadcncraft/section-footer-3
Page: https://shadcncraft.com/blocks/pro-application/section-footers/section-footer-3
Preview: https://shadcncraft.com/view/pro-application/blocks/section-footer-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50291-7185

##### section-footer-4
Name: Section Footer 4
Kind: block
Archetype: Pro Application
Categories: section-footers
Tier: pro
Surfaces: Figma and React
Summary: A footer layout focused on paging controls for long lists or tables.
Install: npx shadcn@latest add @shadcncraft/section-footer-4
Page: https://shadcncraft.com/blocks/pro-application/section-footers/section-footer-4
Preview: https://shadcncraft.com/view/pro-application/blocks/section-footer-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50291-7185

#### Tables (21)

##### table-1
Name: Table 1
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Full-featured data table for admin and SaaS back-office views: customers, users, records, list management.
Install: npx shadcn@latest add @shadcncraft/table-1
Page: https://shadcncraft.com/blocks/pro-application/tables/table-1
Preview: https://shadcncraft.com/view/pro-application/blocks/table-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-51833

##### table-2
Name: Table 2
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Invoice management table for billing and finance dashboards.
Install: npx shadcn@latest add @shadcncraft/table-2
Page: https://shadcncraft.com/blocks/pro-application/tables/table-2
Preview: https://shadcncraft.com/view/pro-application/blocks/table-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-53319

##### table-3
Name: Table 3
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Paginated transactions table with global search, multi-select method and status filters, sortable date and amount columns, row selection and per-row actions.
Install: npx shadcn@latest add @shadcncraft/table-3
Page: https://shadcncraft.com/blocks/pro-application/tables/table-3
Preview: https://shadcncraft.com/view/pro-application/blocks/table-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-54567

##### table-4
Name: Table 4
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Team and workspace member directory for admin and settings pages.
Install: npx shadcn@latest add @shadcncraft/table-4
Page: https://shadcncraft.com/blocks/pro-application/tables/table-4
Preview: https://shadcncraft.com/view/pro-application/blocks/table-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-54578

##### table-5
Name: Table 5
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Task and project-tracking table for project management and sprint views.
Install: npx shadcn@latest add @shadcncraft/table-5
Page: https://shadcncraft.com/blocks/pro-application/tables/table-5
Preview: https://shadcncraft.com/view/pro-application/blocks/table-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-57037

##### table-6
Name: Table 6
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Support ticket queue for helpdesk, support and operations views.
Install: npx shadcn@latest add @shadcncraft/table-6
Page: https://shadcncraft.com/blocks/pro-application/tables/table-6
Preview: https://shadcncraft.com/view/pro-application/blocks/table-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-58221

##### table-7
Name: Table 7
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Paginated audit log for a workspace.
Install: npx shadcn@latest add @shadcncraft/table-7
Page: https://shadcncraft.com/blocks/pro-application/tables/table-7
Preview: https://shadcncraft.com/view/pro-application/blocks/table-7
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-59385

##### table-8
Name: Table 8
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Rich member directory pairing people with projects and files, for team, HR and resource views.
Install: npx shadcn@latest add @shadcncraft/table-8
Page: https://shadcncraft.com/blocks/pro-application/tables/table-8
Preview: https://shadcncraft.com/view/pro-application/blocks/table-8
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-60603

##### table-9
Name: Table 9
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: File manager table for document, asset and workspace file views.
Install: npx shadcn@latest add @shadcncraft/table-9
Page: https://shadcncraft.com/blocks/pro-application/tables/table-9
Preview: https://shadcncraft.com/view/pro-application/blocks/table-9
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-61683

##### table-10
Name: Table 10
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Product performance leaderboard for e-commerce, catalogue and analytics dashboards.
Install: npx shadcn@latest add @shadcncraft/table-10
Page: https://shadcncraft.com/blocks/pro-application/tables/table-10
Preview: https://shadcncraft.com/view/pro-application/blocks/table-10
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-61694

##### table-11
Name: Table 11
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Market and asset-tracking table for crypto, stock and finance dashboards.
Install: npx shadcn@latest add @shadcncraft/table-11
Page: https://shadcncraft.com/blocks/pro-application/tables/table-11
Preview: https://shadcncraft.com/view/pro-application/blocks/table-11
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-61703

##### table-12
Name: Table 12
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Compact transactions card for dashboards and overview panels.
Install: npx shadcn@latest add @shadcncraft/table-12
Page: https://shadcncraft.com/blocks/pro-application/tables/table-12
Preview: https://shadcncraft.com/view/pro-application/blocks/table-12
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-61714

##### table-13
Name: Table 13
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Customer accounts table for sales, success and account-management views.
Install: npx shadcn@latest add @shadcncraft/table-13
Page: https://shadcncraft.com/blocks/pro-application/tables/table-13
Preview: https://shadcncraft.com/view/pro-application/blocks/table-13
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-61723

##### table-14
Name: Table 14
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Members list for team rosters and organisation directories.
Install: npx shadcn@latest add @shadcncraft/table-14
Page: https://shadcncraft.com/blocks/pro-application/tables/table-14
Preview: https://shadcncraft.com/view/pro-application/blocks/table-14
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-61750

##### table-15
Name: Table 15
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Role permissions matrix for settings, access-control and admin views.
Install: npx shadcn@latest add @shadcncraft/table-15
Page: https://shadcncraft.com/blocks/pro-application/tables/table-15
Preview: https://shadcncraft.com/view/pro-application/blocks/table-15
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-61732

##### table-16
Name: Table 16
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Geographic sales block pairing a table with a world map, for regional analytics dashboards.
Install: npx shadcn@latest add @shadcncraft/table-16
Page: https://shadcncraft.com/blocks/pro-application/tables/table-16
Preview: https://shadcncraft.com/view/pro-application/blocks/table-16
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-61741

##### table-17
Name: Table 17
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Empty / first-run state for a data table, for zero-data and filtered-to-nothing views.
Install: npx shadcn@latest add @shadcncraft/table-17
Page: https://shadcncraft.com/blocks/pro-application/tables/table-17
Preview: https://shadcncraft.com/view/pro-application/blocks/table-17
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=179284-39938

##### table-18
Name: Table 18
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: No-results empty state for a data table, for search and filter interactions.
Install: npx shadcn@latest add @shadcncraft/table-18
Page: https://shadcncraft.com/blocks/pro-application/tables/table-18
Preview: https://shadcncraft.com/view/pro-application/blocks/table-18
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-72477

##### table-19
Name: Table 19
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Loading / skeleton state for a data table.
Install: npx shadcn@latest add @shadcncraft/table-19
Page: https://shadcncraft.com/blocks/pro-application/tables/table-19
Preview: https://shadcncraft.com/view/pro-application/blocks/table-19
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-72513

##### table-20
Name: Table 20
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Error / failed-fetch state for a data table.
Install: npx shadcn@latest add @shadcncraft/table-20
Page: https://shadcncraft.com/blocks/pro-application/tables/table-20
Preview: https://shadcncraft.com/view/pro-application/blocks/table-20
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-72504

##### table-21
Name: Table 21
Kind: block
Archetype: Pro Application
Categories: tables
Tier: pro
Surfaces: Figma and React
Summary: Offline / connection-lost state for a data table.
Install: npx shadcn@latest add @shadcncraft/table-21
Page: https://shadcncraft.com/blocks/pro-application/tables/table-21
Preview: https://shadcncraft.com/view/pro-application/blocks/table-21
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=176511-72486

### Pro E-commerce (23 blocks)

#### Checkout (3)

##### checkout-1
Name: Checkout 1
Kind: block
Archetype: Pro E-commerce
Categories: checkout
Tier: pro
Surfaces: Figma and React
Summary: A comprehensive and professional checkout interface featuring a dual-column layout.
Install: npx shadcn@latest add @shadcncraft/checkout-1
Page: https://shadcncraft.com/blocks/pro-ecommerce/checkout/checkout-1
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/checkout-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=85494-12269

##### checkout-2
Name: Checkout 2
Kind: block
Archetype: Pro E-commerce
Categories: checkout
Tier: pro
Surfaces: Figma and React
Summary: Checkout interface that uses a multi-card layout to prioritize order transparency.
Install: npx shadcn@latest add @shadcncraft/checkout-2
Page: https://shadcncraft.com/blocks/pro-ecommerce/checkout/checkout-2
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/checkout-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=85527-20911

##### checkout-3
Name: Checkout 3
Kind: block
Archetype: Pro E-commerce
Categories: checkout
Tier: pro
Surfaces: Figma and React
Summary: A checkout layout that separates order details from data entry through a clean, vertical split.
Install: npx shadcn@latest add @shadcncraft/checkout-3
Page: https://shadcncraft.com/blocks/pro-ecommerce/checkout/checkout-3
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/checkout-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=85543-23385

#### Shopping Cart (4)

##### shopping-cart-1
Name: Shopping Cart 1
Kind: block
Archetype: Pro E-commerce
Categories: shopping-cart
Tier: pro
Surfaces: Figma and React
Summary: A functional slide-out cart interface that appears as an overlay on the right side of the screen.
Install: npx shadcn@latest add @shadcncraft/shopping-cart-1
Page: https://shadcncraft.com/blocks/pro-ecommerce/shopping-cart/shopping-cart-1
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/shopping-cart-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=83714-7505

##### shopping-cart-2
Name: Shopping Cart 2
Kind: block
Archetype: Pro E-commerce
Categories: shopping-cart
Tier: pro
Surfaces: Figma and React
Summary: A comprehensive checkout page featuring a two-column layout.
Install: npx shadcn@latest add @shadcncraft/shopping-cart-2
Page: https://shadcncraft.com/blocks/pro-ecommerce/shopping-cart/shopping-cart-2
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/shopping-cart-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=83751-8032

##### shopping-cart-3
Name: Shopping Cart 3
Kind: block
Archetype: Pro E-commerce
Categories: shopping-cart
Tier: pro
Surfaces: Figma and React
Summary: A streamlined and focused shopping cart layout where all elements are stacked in a single centered column.
Install: npx shadcn@latest add @shadcncraft/shopping-cart-3
Page: https://shadcncraft.com/blocks/pro-ecommerce/shopping-cart/shopping-cart-3
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/shopping-cart-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=83874-7700

##### shopping-cart-4
Name: Shopping Cart 4
Kind: block
Archetype: Pro E-commerce
Categories: shopping-cart
Tier: pro
Surfaces: Figma and React
Summary: A highly organized shopping cart page that utilizes three distinct white cards on a light gray background to separate functional areas.
Install: npx shadcn@latest add @shadcncraft/shopping-cart-4
Page: https://shadcncraft.com/blocks/pro-ecommerce/shopping-cart/shopping-cart-4
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/shopping-cart-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=83889-9921

#### Product Details (6)

##### product-details-1
Name: Product Details 1
Kind: block
Archetype: Pro E-commerce
Categories: product-details
Tier: pro
Surfaces: Figma and React
Summary: A clean and professional product detail section featuring a large primary image on the left and functional configuration tools on the right.
Install: npx shadcn@latest add @shadcncraft/product-details-1
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-details/product-details-1
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-details-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=82604-12948

##### product-details-2
Name: Product Details 2
Kind: block
Archetype: Pro E-commerce
Categories: product-details
Tier: pro
Surfaces: Figma and React
Summary: A comprehensive product layout featuring a top breadcrumb navigation for easy store browsing.
Install: npx shadcn@latest add @shadcncraft/product-details-2
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-details/product-details-2
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-details-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=82619-17659

##### product-details-3
Name: Product Details 3
Kind: block
Archetype: Pro E-commerce
Categories: product-details
Tier: pro
Surfaces: Figma and React
Summary: A content-rich product detail section that prioritizes technical information.
Install: npx shadcn@latest add @shadcncraft/product-details-3
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-details/product-details-3
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-details-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=83231-9520

##### product-details-4
Name: Product Details 4
Kind: block
Archetype: Pro E-commerce
Categories: product-details
Tier: pro
Surfaces: Figma and React
Summary: A streamlined product section featuring a multi-image navigation system.
Install: npx shadcn@latest add @shadcncraft/product-details-4
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-details/product-details-4
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-details-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=83231-11390

##### product-details-5
Name: Product Details 5
Kind: block
Archetype: Pro E-commerce
Categories: product-details
Tier: pro
Surfaces: Figma and React
Summary: A product detail layout featuring an interactive image gallery.
Install: npx shadcn@latest add @shadcncraft/product-details-5
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-details/product-details-5
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-details-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=83251-16247

##### product-details-6
Name: Product Details 6
Kind: block
Archetype: Pro E-commerce
Categories: product-details
Tier: pro
Surfaces: Figma and React
Summary: A comprehensive product layout featuring a centered hero image flanked by essential purchase controls like price, size selection tiles, and a button.
Install: npx shadcn@latest add @shadcncraft/product-details-6
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-details/product-details-6
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-details-6
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=84783-9394

#### Product Category (5)

##### product-category-1
Name: Product Category 1
Kind: block
Archetype: Pro E-commerce
Categories: product-category
Tier: pro
Surfaces: Figma and React
Summary: A visually driven category section featuring a three-column grid.
Install: npx shadcn@latest add @shadcncraft/product-category-1
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-category/product-category-1
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-category-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=82475-7006

##### product-category-2
Name: Product Category 2
Kind: block
Archetype: Pro E-commerce
Categories: product-category
Tier: pro
Surfaces: Figma and React
Summary: A minimalist category navigation section featuring a balanced three-column grid.
Install: npx shadcn@latest add @shadcncraft/product-category-2
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-category/product-category-2
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-category-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=82490-11383

##### product-category-3
Name: Product Category 3
Kind: block
Archetype: Pro E-commerce
Categories: product-category
Tier: pro
Surfaces: Figma and React
Summary: A visually engaging category section featuring an asymmetric three-column layout.
Install: npx shadcn@latest add @shadcncraft/product-category-3
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-category/product-category-3
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-category-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=82490-12133

##### product-category-4
Name: Product Category 4
Kind: block
Archetype: Pro E-commerce
Categories: product-category
Tier: pro
Surfaces: Figma and React
Summary: A dynamic category section featuring an asymmetric three-card grid.
Install: npx shadcn@latest add @shadcncraft/product-category-4
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-category/product-category-4
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-category-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=82498-12539

##### product-category-5
Name: Product Category 5
Kind: block
Archetype: Pro E-commerce
Categories: product-category
Tier: pro
Surfaces: Figma and React
Summary: A clean and balanced category section featuring a four-column grid of tall, vertical cards.
Install: npx shadcn@latest add @shadcncraft/product-category-5
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-category/product-category-5
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-category-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=82502-12777

#### Product List (5)

##### product-list-1
Name: Product List 1
Kind: block
Archetype: Pro E-commerce
Categories: product-list
Tier: pro
Surfaces: Figma and React
Summary: A clean e-commerce section featuring a left-aligned collection header and a four-column product grid.
Install: npx shadcn@latest add @shadcncraft/product-list-1
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-list/product-list-1
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-list-1
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=81858-19357

##### product-list-2
Name: Product List 2
Kind: block
Archetype: Pro E-commerce
Categories: product-list
Tier: pro
Surfaces: Figma and React
Summary: A balanced e-commerce section featuring a centered headline.
Install: npx shadcn@latest add @shadcncraft/product-list-2
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-list/product-list-2
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-list-2
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=81858-28693

##### product-list-3
Name: Product List 3
Kind: block
Archetype: Pro E-commerce
Categories: product-list
Tier: pro
Surfaces: Figma and React
Summary: A modern e-commerce grid featuring products housed in individual white cards with subtle borders.
Install: npx shadcn@latest add @shadcncraft/product-list-3
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-list/product-list-3
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-list-3
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=81914-30797

##### product-list-4
Name: Product List 4
Kind: block
Archetype: Pro E-commerce
Categories: product-list
Tier: pro
Surfaces: Figma and React
Summary: A streamlined e-commerce layout featuring a centered collection header and a four-column grid of bordered product cards.
Install: npx shadcn@latest add @shadcncraft/product-list-4
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-list/product-list-4
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-list-4
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=81914-33728

##### product-list-5
Name: Product List 5
Kind: block
Archetype: Pro E-commerce
Categories: product-list
Tier: pro
Surfaces: Figma and React
Summary: A clean e-commerce section featuring a left-aligned collection header and a four-column product layout.
Install: npx shadcn@latest add @shadcncraft/product-list-5
Page: https://shadcncraft.com/blocks/pro-ecommerce/product-list/product-list-5
Preview: https://shadcncraft.com/view/pro-ecommerce/blocks/product-list-5
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=82021-37489

## Components

### Pro Marketing (26 components)

##### avatar-stack
Name: Avatar Stack
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: free
Surfaces: Figma and React
Summary: A compact, visually appealing component for displaying multiple user avatars in an overlapping stack.
Install: npx shadcn@latest add @shadcncraft/avatar-stack
Page: https://shadcncraft.com/components/pro-marketing/avatar-stack
Preview: https://shadcncraft.com/view/pro-marketing/examples/avatar-stack-example
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=52380-8289

##### blog-blockquote
Name: Blog Blockquote
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A component that highlights a key excerpt or quote from an article.
Install: npx shadcn@latest add @shadcncraft/blog-blockquote
Page: https://shadcncraft.com/components/pro-marketing/blog-blockquote
Preview: https://shadcncraft.com/view/pro-marketing/examples/blog-blockquote-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17897-106071

##### blog-image
Name: Blog Image
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A component that displays an inline or full-width image with an optional caption.
Install: npx shadcn@latest add @shadcncraft/blog-image
Page: https://shadcncraft.com/components/pro-marketing/blog-image
Preview: https://shadcncraft.com/view/pro-marketing/examples/blog-image-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17897-106116

##### chip
Name: Chip
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A component that combines small text with an icon for quick callouts.
Install: npx shadcn@latest add @shadcncraft/chip
Page: https://shadcncraft.com/components/pro-marketing/chip
Preview: https://shadcncraft.com/view/pro-marketing/examples/chip-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17897-106386

##### feature-stack
Name: Feature Stack
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A component that arranges an icon, header, body text, and CTA in different layout styles.
Install: npx shadcn@latest add @shadcncraft/feature-stack
Page: https://shadcncraft.com/components/pro-marketing/feature-stack
Preview: https://shadcncraft.com/view/pro-marketing/examples/feature-stack-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17897-106296

##### featured-icon
Name: Featured Icon
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: free
Surfaces: Figma and React
Summary: A component that places an icon inside a styled square or circle frame for extra prominence.
Install: npx shadcn@latest add @shadcncraft/featured-icon
Page: https://shadcncraft.com/components/pro-marketing/featured-icon
Preview: https://shadcncraft.com/view/pro-marketing/examples/featured-icon-example
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17897-100009

##### job-listing
Name: Job Listing
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A component that displays open roles in a card format with a badge, title, short body, and feature chips.
Install: npx shadcn@latest add @shadcncraft/job-listing
Page: https://shadcncraft.com/components/pro-marketing/job-listing
Preview: https://shadcncraft.com/view/pro-marketing/examples/job-listing-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17897-106431

##### marquee
Name: Marquee
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: free
Surfaces: Figma and React
Summary: A smooth, endlessly looping scroller ideal for showcasing logos, testimonials, images, or sponsor lists.
Install: npx shadcn@latest add @shadcncraft/marquee
Page: https://shadcncraft.com/components/pro-marketing/marquee
Preview: https://shadcncraft.com/view/pro-marketing/examples/marquee-example
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=81614-10088

##### metric
Name: Metric
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A component that displays large stats with a sub-label for context.
Install: npx shadcn@latest add @shadcncraft/metric
Page: https://shadcncraft.com/components/pro-marketing/metric
Preview: https://shadcncraft.com/view/pro-marketing/examples/metric-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17897-105890

##### mobile-navigation-menu
Name: Mobile Navigation Menu
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A Mobile Navigation Menu component that provides expandable menus for small screens.
Install: npx shadcn@latest add @shadcncraft/mobile-navigation-menu
Page: https://shadcncraft.com/components/pro-marketing/mobile-navigation-menu
Preview: https://shadcncraft.com/view/pro-marketing/examples/mobile-navigation-menu-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17897-97306

##### page-heading
Name: Page Heading
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: free
Surfaces: Figma and React
Summary: A component that acts as the text-focused version of a hero banner.
Install: npx shadcn@latest add @shadcncraft/page-heading
Page: https://shadcncraft.com/components/pro-marketing/page-heading
Preview: https://shadcncraft.com/view/pro-marketing/examples/page-heading-example
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=18403-114401

##### placeholder-logo
Name: Placeholder Logo
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: free
Surfaces: Figma and React
Summary: A component for that can be replaced with your brand's main logo.
Install: npx shadcn@latest add @shadcncraft/placeholder-logo
Page: https://shadcncraft.com/components/pro-marketing/placeholder-logo
Preview: https://shadcncraft.com/view/pro-marketing/examples/placeholder-logo-example
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17897-100144

##### profile-card
Name: Profile Card
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: free
Surfaces: Figma and React
Summary: An extension of the avatar component with more details on the individual.
Install: npx shadcn@latest add @shadcncraft/profile-card
Page: https://shadcncraft.com/components/pro-marketing/profile-card
Preview: https://shadcncraft.com/view/pro-marketing/examples/profile-card-example
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17897-105981

##### section-heading
Name: Section Heading
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: free
Surfaces: Figma and React
Summary: A component that standardizes heading typography and spacing.
Install: npx shadcn@latest add @shadcncraft/section-heading
Page: https://shadcncraft.com/components/pro-marketing/section-heading
Preview: https://shadcncraft.com/view/pro-marketing/examples/section-heading-example
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17897-105935

##### star-rating
Name: Star Rating
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: free
Surfaces: Figma and React
Summary: A component that displays ratings with stars and an optional label.
Install: npx shadcn@latest add @shadcncraft/star-rating
Page: https://shadcncraft.com/components/pro-marketing/star-rating
Preview: https://shadcncraft.com/view/pro-marketing/examples/star-rating-example
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17897-99964

##### sub-feature
Name: Sub Feature
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A component that presents a smaller feature layout for a dialled-back look.
Install: npx shadcn@latest add @shadcncraft/sub-feature
Page: https://shadcncraft.com/components/pro-marketing/sub-feature
Preview: https://shadcncraft.com/view/pro-marketing/examples/sub-feature-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17897-100234

##### tagline
Name: Tagline
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: free
Surfaces: Figma and React
Summary: A component that displays a tagline with different variants.
Install: npx shadcn@latest add @shadcncraft/tagline
Page: https://shadcncraft.com/components/pro-marketing/tagline
Preview: https://shadcncraft.com/view/pro-marketing/examples/tagline-example
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=17897-105936

##### ui-showcase
Name: UI Showcase
Kind: component
Archetype: Pro Marketing
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A Placeholder that displays content in a device-style frame.
Install: npx shadcn@latest add @shadcncraft/ui-showcase
Page: https://shadcncraft.com/components/pro-marketing/ui-showcase
Preview: https://shadcncraft.com/view/pro-marketing/examples/ui-showcase-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17897-100099

##### blog-listing-card-1
Name: Blog Listing Card 1
Kind: component
Archetype: Pro Marketing
Categories: blog-listing-card
Tier: pro
Surfaces: Figma and React
Summary: A component that displays a blog listing card in a vertical or horizontal orientation.
Install: npx shadcn@latest add @shadcncraft/blog-listing-card-1
Page: https://shadcncraft.com/components/pro-marketing/blog-listing-card-1
Preview: https://shadcncraft.com/view/pro-marketing/examples/blog-listing-card-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50421-44458

##### blog-listing-card-2
Name: Blog Listing Card 2
Kind: component
Archetype: Pro Marketing
Categories: blog-listing-card
Tier: pro
Surfaces: Figma and React
Summary: A component that displays a blog listing card in a card format in a vertical or horizontal orientation.
Install: npx shadcn@latest add @shadcncraft/blog-listing-card-2
Page: https://shadcncraft.com/components/pro-marketing/blog-listing-card-2
Preview: https://shadcncraft.com/view/pro-marketing/examples/blog-listing-card-2-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50421-44458

##### blog-listing-featured-card-1
Name: Blog Listing Featured Card 1
Kind: component
Archetype: Pro Marketing
Categories: blog-listing-featured-card
Tier: pro
Surfaces: Figma and React
Summary: A large featured blog card intended for featuring a blog post.
Install: npx shadcn@latest add @shadcncraft/blog-listing-featured-card-1
Page: https://shadcncraft.com/components/pro-marketing/blog-listing-featured-card-1
Preview: https://shadcncraft.com/view/pro-marketing/examples/blog-listing-featured-card-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50493-81251

##### blog-listing-featured-card-2
Name: Blog Listing Featured Card 2
Kind: component
Archetype: Pro Marketing
Categories: blog-listing-featured-card
Tier: pro
Surfaces: Figma and React
Summary: A large featured blog card intended for featuring a blog post.
Install: npx shadcn@latest add @shadcncraft/blog-listing-featured-card-2
Page: https://shadcncraft.com/components/pro-marketing/blog-listing-featured-card-2
Preview: https://shadcncraft.com/view/pro-marketing/examples/blog-listing-featured-card-2-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50493-81251

##### blog-listing-featured-card-3
Name: Blog Listing Featured Card 3
Kind: component
Archetype: Pro Marketing
Categories: blog-listing-featured-card
Tier: pro
Surfaces: Figma and React
Summary: A large featured blog card intended for featuring a blog post.
Install: npx shadcn@latest add @shadcncraft/blog-listing-featured-card-3
Page: https://shadcncraft.com/components/pro-marketing/blog-listing-featured-card-3
Preview: https://shadcncraft.com/view/pro-marketing/examples/blog-listing-featured-card-3-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50493-81251

##### pricing-card-1
Name: Pricing Card 1
Kind: component
Archetype: Pro Marketing
Categories: pricing-card
Tier: pro
Surfaces: Figma and React
Summary: A component for Figma that compares plans with layout variants, including a 'Most Popular' highlight.
Install: npx shadcn@latest add @shadcncraft/pricing-card-1
Page: https://shadcncraft.com/components/pro-marketing/pricing-card-1
Preview: https://shadcncraft.com/view/pro-marketing/examples/pricing-card-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17897-105845

##### team-card-1
Name: Team Card 1
Kind: component
Archetype: Pro Marketing
Categories: team-card
Tier: pro
Surfaces: Figma and React
Summary: A component that displays a user's image alongside their name, a supporting detail such as role or date and social links.
Install: npx shadcn@latest add @shadcncraft/team-card-1
Page: https://shadcncraft.com/components/pro-marketing/team-card-1
Preview: https://shadcncraft.com/view/pro-marketing/examples/team-card-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=59594-23755

##### team-card-2
Name: Team Card 2
Kind: component
Archetype: Pro Marketing
Categories: team-card
Tier: pro
Surfaces: Figma and React
Summary: A component that displays a user's image alongside their name, a description and social links.
Install: npx shadcn@latest add @shadcncraft/team-card-2
Page: https://shadcncraft.com/components/pro-marketing/team-card-2
Preview: https://shadcncraft.com/view/pro-marketing/examples/team-card-2-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=59594-23755

### Pro Application (24 components)

##### announcement
Name: Announcement
Kind: component
Archetype: Pro Application
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A lightweight announcement component for highlighting updates, releases, or important notices without interrupting the main flow.
Install: npx shadcn@latest add @shadcncraft/announcement
Page: https://shadcncraft.com/components/pro-application/announcement
Preview: https://shadcncraft.com/view/pro-application/examples/announcement-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=51518-5827

##### data-table-pagination
Name: Data Table Pagination
Kind: component
Archetype: Pro Application
Categories: none
Tier: pro
Surfaces: React
Summary: A pagination footer for TanStack Table data tables.
Install: npx shadcn@latest add @shadcncraft/data-table-pagination
Page: https://shadcncraft.com/components/pro-application/data-table-pagination
Preview: https://shadcncraft.com/view/pro-application/examples/data-table-pagination-example

##### inline-hint
Name: Inline Hint
Kind: component
Archetype: Pro Application
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: An Inline Hint is a lightweight, non-intrusive UI pattern that provides helpful guidance, clarification, or best-practice advice directly within or immediately adjacent to a form field, input, or interactive element, without requiring the user to leave the current context.
Install: npx shadcn@latest add @shadcncraft/inline-hint
Page: https://shadcncraft.com/components/pro-application/inline-hint
Preview: https://shadcncraft.com/view/pro-application/examples/inline-hint-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=51146-55591

##### messaging
Name: Messaging
Kind: component
Archetype: Pro Application
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A flexible messaging component for displaying conversational threads.
Install: npx shadcn@latest add @shadcncraft/messaging
Page: https://shadcncraft.com/components/pro-application/messaging
Preview: https://shadcncraft.com/view/pro-application/examples/messaging-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=52052-13668

##### rich-separator
Name: Rich Separator
Kind: component
Archetype: Pro Application
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A horizontal divider with optional inline content like labels, tabs, or actions.
Install: npx shadcn@latest add @shadcncraft/rich-separator
Page: https://shadcncraft.com/components/pro-application/rich-separator
Preview: https://shadcncraft.com/view/pro-application/examples/rich-separator-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=51958-5254

##### tags
Name: Tags
Kind: component
Archetype: Pro Application
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A multi-select tag picker for filtering or categorizing content.
Install: npx shadcn@latest add @shadcncraft/tags
Page: https://shadcncraft.com/components/pro-application/tags
Preview: https://shadcncraft.com/view/pro-application/examples/tags-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=51923-8484

##### ticker
Name: Ticker
Kind: component
Archetype: Pro Application
Categories: none
Tier: pro
Surfaces: Figma and React
Summary: A compact, inline ticker for live or near-real-time values.
Install: npx shadcn@latest add @shadcncraft/ticker
Page: https://shadcncraft.com/components/pro-application/ticker
Preview: https://shadcncraft.com/view/pro-application/examples/ticker-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=53560-64388

##### badge
Name: Badge
Kind: component
Archetype: Pro Application
Categories: none
Tier: free
Surfaces: Figma and React
Summary: Displays a badge or a component that looks like a badge.
Install: npx shadcn@latest add @shadcncraft/badge
Page: https://shadcncraft.com/components/pro-application/badge
Preview: https://shadcncraft.com/view/pro-application/examples/badge-example
Figma: https://www.figma.com/design/J2TEyxBl5KhsemzOObfuW7/shadcncraft-Base-%E2%80%A2-v3.0?node-id=2814-11330

##### activity-feed-item-1
Name: Activity Feed Item 1
Kind: component
Archetype: Pro Application
Categories: activity-feed-item
Tier: pro
Surfaces: Figma and React
Summary: A flexible feed item for displaying recent activity in a clear, scannable format.
Install: npx shadcn@latest add @shadcncraft/activity-feed-item-1
Page: https://shadcncraft.com/components/pro-application/activity-feed-item-1
Preview: https://shadcncraft.com/view/pro-application/examples/activity-feed-item-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50337-18245

##### avatar-upload-1
Name: Avatar Upload 1
Kind: component
Archetype: Pro Application
Categories: avatar-upload
Tier: pro
Surfaces: Figma and React
Summary: A focused component for adding or updating a user profile image.
Install: npx shadcn@latest add @shadcncraft/avatar-upload-1
Page: https://shadcncraft.com/components/pro-application/avatar-upload-1
Preview: https://shadcncraft.com/view/pro-application/examples/avatar-upload-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=53608-85018

##### avatar-upload-2
Name: Avatar Upload 2
Kind: component
Archetype: Pro Application
Categories: avatar-upload
Tier: pro
Surfaces: Figma and React
Summary: A focused component for adding or updating a user profile image.
Install: npx shadcn@latest add @shadcncraft/avatar-upload-2
Page: https://shadcncraft.com/components/pro-application/avatar-upload-2
Preview: https://shadcncraft.com/view/pro-application/examples/avatar-upload-2-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=53608-85018

##### balance-1
Name: Balance 1
Kind: component
Archetype: Pro Application
Categories: balance
Tier: pro
Surfaces: Figma and React
Summary: A data-rich component for showing an account balance at a glance, with supporting context over time.
Install: npx shadcn@latest add @shadcncraft/balance-1
Page: https://shadcncraft.com/components/pro-application/balance-1
Preview: https://shadcncraft.com/view/pro-application/examples/balance-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=52582-55382

##### balance-2
Name: Balance 2
Kind: component
Archetype: Pro Application
Categories: balance
Tier: pro
Surfaces: Figma and React
Summary: A data-rich component for showing an account balance at a glance, with supporting context over time.
Install: npx shadcn@latest add @shadcncraft/balance-2
Page: https://shadcncraft.com/components/pro-application/balance-2
Preview: https://shadcncraft.com/view/pro-application/examples/balance-2-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=52582-55382

##### balance-3
Name: Balance 3
Kind: component
Archetype: Pro Application
Categories: balance
Tier: pro
Surfaces: Figma and React
Summary: A data-rich component for showing an account balance at a glance, with supporting context over time.
Install: npx shadcn@latest add @shadcncraft/balance-3
Page: https://shadcncraft.com/components/pro-application/balance-3
Preview: https://shadcncraft.com/view/pro-application/examples/balance-3-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=52582-55382

##### expenses-1
Name: Expenses 1
Kind: component
Archetype: Pro Application
Categories: expenses
Tier: pro
Surfaces: Figma and React
Summary: A compact data visualization component for showing spending by category over a selected time range.
Install: npx shadcn@latest add @shadcncraft/expenses-1
Page: https://shadcncraft.com/components/pro-application/expenses-1
Preview: https://shadcncraft.com/view/pro-application/examples/expenses-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=52584-56367

##### message-card-1
Name: Message Card 1
Kind: component
Archetype: Pro Application
Categories: message-card
Tier: pro
Surfaces: Figma and React
Summary: A compact summary component for individual messages or threads.
Install: npx shadcn@latest add @shadcncraft/message-card-1
Page: https://shadcncraft.com/components/pro-application/message-card-1
Preview: https://shadcncraft.com/view/pro-application/examples/message-card-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=58310-7419

##### spending-balance-1
Name: Spending Balance 1
Kind: component
Archetype: Pro Application
Categories: spending-balance
Tier: pro
Surfaces: Figma and React
Summary: A summary card that shows total spend for a period, with a clear visual cue and a simple category breakdown.
Install: npx shadcn@latest add @shadcncraft/spending-balance-1
Page: https://shadcncraft.com/components/pro-application/spending-balance-1
Preview: https://shadcncraft.com/view/pro-application/examples/spending-balance-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=52115-42478

##### stock-market-1
Name: Stock Market 1
Kind: component
Archetype: Pro Application
Categories: stock-market
Tier: pro
Surfaces: Figma and React
Summary: A market snapshot card that shows current value, change over time, and basic context.
Install: npx shadcn@latest add @shadcncraft/stock-market-1
Page: https://shadcncraft.com/components/pro-application/stock-market-1
Preview: https://shadcncraft.com/view/pro-application/examples/stock-market-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=52563-52450

##### transactions-1
Name: Transactions 1
Kind: component
Archetype: Pro Application
Categories: transactions
Tier: pro
Surfaces: Figma and React
Summary: A compact transaction list for recent activity.
Install: npx shadcn@latest add @shadcncraft/transactions-1
Page: https://shadcncraft.com/components/pro-application/transactions-1
Preview: https://shadcncraft.com/view/pro-application/examples/transactions-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=53553-62880

##### metric-card-1
Name: Metric Card 1
Kind: component
Archetype: Pro Application
Categories: metric-card
Tier: pro
Surfaces: Figma and React
Summary: A compact summary block for highlighting a single key metric.
Install: npx shadcn@latest add @shadcncraft/metric-card-1
Page: https://shadcncraft.com/components/pro-application/metric-card-1
Preview: https://shadcncraft.com/view/pro-application/examples/metric-card-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50471-15466

##### metric-card-2
Name: Metric Card 2
Kind: component
Archetype: Pro Application
Categories: metric-card
Tier: pro
Surfaces: Figma and React
Summary: A compact summary block for highlighting a single key metric.
Install: npx shadcn@latest add @shadcncraft/metric-card-2
Page: https://shadcncraft.com/components/pro-application/metric-card-2
Preview: https://shadcncraft.com/view/pro-application/examples/metric-card-2-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50471-15466

##### progress-item-1
Name: Progress Item 1
Kind: component
Archetype: Pro Application
Categories: progress-item
Tier: pro
Surfaces: Figma and React
Summary: A single step within a progress sequence used to show order, status, and context.
Install: npx shadcn@latest add @shadcncraft/progress-item-1
Page: https://shadcncraft.com/components/pro-application/progress-item-1
Preview: https://shadcncraft.com/view/pro-application/examples/progress-item-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50385-40557

##### file-upload-card-1
Name: File Upload Card 1
Kind: component
Archetype: Pro Application
Categories: file-upload-card
Tier: pro
Surfaces: Figma and React
Summary: A self-contained upload item that shows the status of an individual file during and after upload.
Install: npx shadcn@latest add @shadcncraft/file-upload-card-1
Page: https://shadcncraft.com/components/pro-application/file-upload-card-1
Preview: https://shadcncraft.com/view/pro-application/examples/file-upload-card-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50231-18937

##### file-upload-area-1
Name: File Upload Area 1
Kind: component
Archetype: Pro Application
Categories: file-upload-area
Tier: pro
Surfaces: Figma and React
Summary: A dedicated drop zone for selecting files via drag-and-drop or manual browsing.
Install: npx shadcn@latest add @shadcncraft/file-upload-area-1
Page: https://shadcncraft.com/components/pro-application/file-upload-area-1
Preview: https://shadcncraft.com/view/pro-application/examples/file-upload-area-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50132-51670

### Pro E-commerce (5 components)

##### image-zoom
Name: Image Zoom
Kind: component
Archetype: Pro E-commerce
Categories: none
Tier: free
Surfaces: React
Summary: Image zoom is a component that allows you to zoom in on an image.
Install: npx shadcn@latest add @shadcncraft/image-zoom
Page: https://shadcncraft.com/components/pro-ecommerce/image-zoom
Preview: https://shadcncraft.com/view/pro-ecommerce/examples/image-zoom-example

##### cart-item-1
Name: Cart Item 1
Kind: component
Archetype: Pro E-commerce
Categories: cart-item
Tier: pro
Surfaces: Figma and React
Summary: TBD
Install: npx shadcn@latest add @shadcncraft/cart-item-1
Page: https://shadcncraft.com/components/pro-ecommerce/cart-item-1
Preview: https://shadcncraft.com/view/pro-ecommerce/examples/cart-item-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=83714-9975

##### product-category-card-1
Name: Product Category Card 1
Kind: component
Archetype: Pro E-commerce
Categories: product-category-card
Tier: pro
Surfaces: Figma and React
Summary: TBD
Install: npx shadcn@latest add @shadcncraft/product-category-card-1
Page: https://shadcncraft.com/components/pro-ecommerce/product-category-card-1
Preview: https://shadcncraft.com/view/pro-ecommerce/examples/product-category-card-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=82475-6238

##### product-card-1
Name: Product Card 1
Kind: component
Archetype: Pro E-commerce
Categories: product-card
Tier: pro
Surfaces: Figma and React
Summary: TBD
Install: npx shadcn@latest add @shadcncraft/product-card-1
Page: https://shadcncraft.com/components/pro-ecommerce/product-card-1
Preview: https://shadcncraft.com/view/pro-ecommerce/examples/product-card-1-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=81858-11810

##### product-card-2
Name: Product Card 2
Kind: component
Archetype: Pro E-commerce
Categories: product-card
Tier: pro
Surfaces: Figma and React
Summary: TBD
Install: npx shadcn@latest add @shadcncraft/product-card-2
Page: https://shadcncraft.com/components/pro-ecommerce/product-card-2
Preview: https://shadcncraft.com/view/pro-ecommerce/examples/product-card-2-example
Figma: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=81858-11810

## Hooks

##### use-carousel
Name: Use Carousel
Kind: hook
Archetype: Hooks
Categories: none
Tier: free
Surfaces: React
Summary: Use Carousel
Install: npx shadcn@latest add @shadcncraft/use-carousel
Preview: https://shadcncraft.com/view

##### use-click-outside
Name: Use Click Outside
Kind: hook
Archetype: Hooks
Categories: none
Tier: free
Surfaces: React
Summary: Use Click Outside
Install: npx shadcn@latest add @shadcncraft/use-click-outside
Preview: https://shadcncraft.com/view

##### use-mobile
Name: Use Mobile
Kind: hook
Archetype: Hooks
Categories: none
Tier: free
Surfaces: React
Summary: Use Mobile
Install: npx shadcn@latest add @shadcncraft/use-mobile
Preview: https://shadcncraft.com/view

##### use-file-upload
Name: Use File Upload
Kind: hook
Archetype: Hooks
Categories: none
Tier: pro
Surfaces: React
Summary: TBD
Install: npx shadcn@latest add @shadcncraft/use-file-upload
Preview: https://shadcncraft.com/view

## Figma page designs

Multi-section screen layouts composed from pro components. These exist in Figma only.
There is no shadcn CLI install for a page: rebuild it from the blocks and components it
is composed of, which are listed above.

### settings
Title: Settings
Categories: pro-application
Summary: Profile, billing, security & team preferences
Page: https://shadcncraft.com/pages/settings
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=53608-67632

### messaging
Title: Messaging
Categories: pro-application
Summary: Conversations, threads & file sharing
Page: https://shadcncraft.com/pages/messaging
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=57490-3758

### dashboard
Title: Dashboard
Categories: pro-application
Summary: Cards, charts & transaction tables
Page: https://shadcncraft.com/pages/dashboard
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=50566-127004

### team
Title: Team
Categories: pro-marketing
Summary: Member profiles, roles & social links
Page: https://shadcncraft.com/pages/team
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=18446-90500

### pricing
Title: Pricing
Categories: pro-marketing
Summary: Tiered plans, feature comparison & CTAs
Page: https://shadcncraft.com/pages/pricing
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=18446-83020

### landing-page
Title: Landing Page
Categories: pro-marketing
Summary: Hero, features, social proof & conversion
Page: https://shadcncraft.com/pages/landing-page
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=18343-109870

### faq
Title: FAQ
Categories: pro-marketing
Summary: Grouped questions & expandable answers
Page: https://shadcncraft.com/pages/faq
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=18446-93608

### contact
Title: Contact
Categories: pro-marketing
Summary: Forms, maps & location details
Page: https://shadcncraft.com/pages/contact
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=18445-64141

### blog-listing
Title: Blog Listing
Categories: pro-marketing
Summary: Article tiles, featured posts & metadata
Page: https://shadcncraft.com/pages/blog-listing
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=18403-113583

### blog-post
Title: Blog Post
Categories: pro-marketing
Summary: Content layout, author section & related posts
Page: https://shadcncraft.com/pages/blog-post
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=17859-94503

### about
Title: About
Categories: pro-marketing
Summary: Mission, values, team & social proof
Page: https://shadcncraft.com/pages/about
Figma preview: https://www.figma.com/design/AowV2WsmEZ4NXBlHlrsBg8/shadcncraft-Pro-%E2%80%A2-v3.1-%E2%80%A2-Preview?node-id=18446-88096

## Site templates

### clearflow
Title: ClearFlow
Summary: A clean, modern SaaS website template designed for B2B fintech, payments, and workflow tools.
Price: $79 USD (one-time)
Page: https://shadcncraft.com/sites/clearflow
Live preview: https://clearflow-next-template.vercel.app/
Figma preview: https://embed.figma.com/design/S6zPENqoseK6gP0QasvJ8r/ClearFlow-Template-1.0.0-%E2%80%A2-Shadcraft-%E2%80%A2-PREVIEW?node-id=49718-32439&embed-host=share

## Figma plugin

Free to install: https://www.figma.com/community/plugin/1596974152705664025

- Authors a complete shadcn style natively in Figma (base colour, accent, chart palette,
  heading and body font, icon library, radius) as variable modes, with nothing detached.
- Two-way sync with shadcn Create: every style has a matching preset code.
- Imports themes from tweakcn by preset, custom URL, or a signed-in account.
- Imports an existing globals.css, and exports CSS as Tailwind v4 oklch.
- React code export and shadcn CLI command generation, both requiring Pro Figma + React.

Note on MCP: shadcncraft does not publish an MCP server. The registry is documented to
work with the official shadcn MCP server, and the Figma kits work with the official
Figma MCP server. Agent skills make those workflows repeatable.

## Agent skills

Package: @shadcncraft/skills (MIT licensed, free to install).

```bash
npx @shadcncraft/skills add all
npx @shadcncraft/skills list
npx @shadcncraft/skills add all --tool claude,cursor,codex
```

The skills install without a licence key. What they install is gated by the registry:
free-tier items install for anyone, pro items require a licence key, enforced server-side.

### shadcncraft-generate-code
Turns a selected Figma frame, component, or page into React and shadcn/ui code, resolving the frame to the matching registry block and installing it rather than approximating the design.
Requires: Pro React or Pro Figma + React
Install: npx @shadcncraft/skills add generate-code

### shadcncraft-import-variables
Syncs design tokens (color, radius, typography, shadow, spacing) into globals.css as a complete shadcn token set for light and dark, merged into a managed region that leaves surrounding customizations intact.
Requires: no licence key
Install: npx @shadcncraft/skills add import-variables