---
name: "@shadcncraft"
slug: "shadcncraft"
description: "Free, open-source shadcn/ui registry shipping polished, production-ready components and marketing blocks, part of a larger Shadcncraft ecosystem that also includes a matched Figma UI kit and a premium React design system. The free tier covers landing-page building blocks (Hero, Feature, CTA, and similar marketing sections) aligned to shadcn/ui conventions and Tailwind CSS. Installable via the shadcn CLI using the @shadcncraft namespace. Use for: adding high-quality landing-page sections to a Next.js or React project without installing a heavyweight template."
category: "Blocks & sections (marketing/SaaS)"
tags: ["animation", "blocks", "buttons", "cards", "design-system", "hooks", "icons", "marketing", "media", "mobile", "navigation", "overlays", "pro-available", "saas"]
framework: "react"
license: "Apache-2.0"
author: "shadcncraft"
website: "https://shadcncraft.com"
github: "https://github.com/shadcncraft/shadcncraft-free"
registry: "https://shadcncraft.com/r/registry.json"
pro: true
pro_url: "https://shadcncraft.com/pricing"
github_stars: 30
component_count: 26
generated_at: "2026-07-28T08:59:05.895Z"
---

# @shadcncraft

Free, open-source shadcn/ui registry shipping polished, production-ready components and marketing blocks, part of a larger Shadcncraft ecosystem that also includes a matched Figma UI kit and a premium React design system. The free tier covers landing-page building blocks (Hero, Feature, CTA, and similar marketing sections) aligned to shadcn/ui conventions and Tailwind CSS. Installable via the shadcn CLI using the @shadcncraft namespace. Use for: adding high-quality landing-page sections to a Next.js or React project without installing a heavyweight template.

## Links

- Website: https://shadcncraft.com
- GitHub: https://github.com/shadcncraft/shadcncraft-free
- Registry JSON: https://shadcncraft.com/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/shadcncraft
- This file: https://sh4dcn.vercel.app/md/shadcncraft.md
- Pro / pricing: https://shadcncraft.com/pricing

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://shadcncraft.com/r/registry.json
pnpm dlx shadcn@latest add https://shadcncraft.com/r/registry.json
bunx shadcn@latest add https://shadcncraft.com/r/registry.json
# clone the source repo
git clone https://github.com/shadcncraft/shadcncraft-free.git
# fetch the raw registry index
curl -s https://shadcncraft.com/r/registry.json
```

## Components (26)

| name | type | description | install |
| --- | --- | --- | --- |
| index | registry:style | — | `npx shadcn@latest add https://shadcncraft.com/r/index.json` |
| style | registry:style | — | `npx shadcn@latest add https://shadcncraft.com/r/style.json` |
| avatar-stack | registry:ui | A compact, visually appealing component for displaying multiple user avatars in an overlapping stack. Perfect for showing participants in a group chat, team me… | `npx shadcn@latest add https://shadcncraft.com/r/avatar-stack.json` |
| featured-icon | registry:ui | A component that places an icon inside a styled square or circle frame for extra prominence. This component makes supporting visuals stand out in marketing lay… | `npx shadcn@latest add https://shadcncraft.com/r/featured-icon.json` |
| marquee | registry:ui | A smooth, endlessly looping scroller ideal for showcasing logos, testimonials, images, or sponsor lists. Features auto-play with customizable speed, pause-on-h… | `npx shadcn@latest add https://shadcncraft.com/r/marquee.json` |
| page-heading | registry:ui | A component that acts as the text-focused version of a hero banner. This component combines a pre-heading label, an H1 heading, supporting description text, an… | `npx shadcn@latest add https://shadcncraft.com/r/page-heading.json` |
| placeholder-logo | registry:ui | A component for that can be replaced with your brand's main logo. This component ensures layouts stay consistent before brand assets are applied. | `npx shadcn@latest add https://shadcncraft.com/r/placeholder-logo.json` |
| profile-card | registry:ui | An extension of the avatar component with more details on the individual. Good for blog posts etc. | `npx shadcn@latest add https://shadcncraft.com/r/profile-card.json` |
| section-heading | registry:ui | A component that standardizes heading typography and spacing. This component includes a pre-heading label, main heading, and body text in different layout vari… | `npx shadcn@latest add https://shadcncraft.com/r/section-heading.json` |
| star-rating | registry:ui | A component that displays ratings with stars and an optional label. This component builds trust with visual feedback. | `npx shadcn@latest add https://shadcncraft.com/r/star-rating.json` |
| tagline | registry:ui | A component that displays a tagline with different variants. | `npx shadcn@latest add https://shadcncraft.com/r/tagline.json` |
| badge | registry:ui | Displays a badge or a component that looks like a badge. | `npx shadcn@latest add https://shadcncraft.com/r/badge.json` |
| image-zoom | registry:ui | Image zoom is a component that allows you to zoom in on an image. | `npx shadcn@latest add https://shadcncraft.com/r/image-zoom.json` |
| banner-10 | registry:block | A minimal announcement banner for low-friction updates. Renders as simple inline text with an optional icon and link, plus a close action. Best for subtle prod… | `npx shadcn@latest add https://shadcncraft.com/r/banner-10.json` |
| benefits-13 | registry:block | A layout with a section header followed by a grid of equal-height cards. Each card includes an icon, title, and short text, arranged in a consistent grid that … | `npx shadcn@latest add https://shadcncraft.com/r/benefits-13.json` |
| contact-11 | registry:block | A balanced contact layout with a primary, centered form and a secondary sidebar that mirrors or reinforces the same interaction. The main column keeps focus on… | `npx shadcn@latest add https://shadcncraft.com/r/contact-11.json` |
| faqs-4 | registry:block | A clean, centered FAQ accordion paired with a narrow sidebar version. Uses a strong section header and clear dividers for easy scanning, with an optional suppo… | `npx shadcn@latest add https://shadcncraft.com/r/faqs-4.json` |
| footer-4 | registry:block | A sitemap footer anchored by a short brand statement and logo, followed by structured link columns and legal links. Gives more context about the company while … | `npx shadcn@latest add https://shadcncraft.com/r/footer-4.json` |
| newsletter-signup-5 | registry:block | A horizontal newsletter signup pattern presented inside a soft container to separate it from surrounding content. The headline and description anchor the left … | `npx shadcn@latest add https://shadcncraft.com/r/newsletter-signup-5.json` |
| testimonials-11 | registry:block | A structured testimonial layout that combines a clear section header with a multi-column grid of short quotes. It balances scannability and depth by presenting… | `npx shadcn@latest add https://shadcncraft.com/r/testimonials-11.json` |
| top-navigation-5 | registry:block | A stripped-back, center-aligned top navigation that prioritizes clarity and whitespace. Primary links sit in a single horizontal row with the brand anchored to… | `npx shadcn@latest add https://shadcncraft.com/r/top-navigation-5.json` |
| semantic-tokens | registry:theme | — | `npx shadcn@latest add https://shadcncraft.com/r/semantic-tokens.json` |
| design-system | registry:style | — | `npx shadcn@latest add https://shadcncraft.com/r/design-system.json` |
| use-carousel | registry:hook | — | `npx shadcn@latest add https://shadcncraft.com/r/use-carousel.json` |
| use-click-outside | registry:hook | — | `npx shadcn@latest add https://shadcncraft.com/r/use-click-outside.json` |
| use-mobile | registry:hook | — | `npx shadcn@latest add https://shadcncraft.com/r/use-mobile.json` |

## For AI agents

```text
You are adding components from @shadcncraft to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/shadcncraft.md) for the component list.
2. Fetch the machine-readable index: https://shadcncraft.com/r/registry.json
3. Install a single component with its install command from the table above.
4. Full structured record: https://sh4dcn.vercel.app/json (library slug: shadcncraft).
```
