sh4dcnv2 · atlas
← libraries

@navui

shadcn-compatible components, blocks, and illustrations that adapt to your existing design configuration.

62 components pro available react shadcn-cli MIT

Install this registry

shadcn (npm) npx shadcn@latest add https://ui.navdeepsingh.dev/r/registry.json
pnpm pnpm dlx shadcn@latest add https://ui.navdeepsingh.dev/r/registry.json
bun bunx shadcn@latest add https://ui.navdeepsingh.dev/r/registry.json
fetch registry curl -s https://ui.navdeepsingh.dev/r/registry.json

Components

62 total
Animated Numbers ui

Accessible in-view number counter with locale-aware formatting and reduced-motion support.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/animated-numbers.json
Animated Tabs ui

A tab component with a moving active pill and directional content transitions.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/animated-tabs.json
Approval Panel Illustration component

An approval routing panel illustration.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/approval-panel.json
Blog Section One block

A semantic blog archive grouped by year, with aligned dates, useful metadata, and accessible row links.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/blog-section-one.json
Contact Section Four block

A focused project-inquiry form with contact details and a large editorial heading.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/contact-section-four.json
Contact Section One block

A contact directory that routes visitors to sales, support, community, documentation, and developer resources.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/contact-section-one.json
Contact Section Three block

A compact project contact form paired with a concise service introduction.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/contact-section-three.json
Contact Section Two block

A split contact section with a consultation summary and detailed project inquiry form.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/contact-section-two.json
Content Section Five block

A sticky editorial narrative with a normal mobile flow and a sequence of image-led content panels.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/content-section-five.json
Content Section Four block

A connected-publishing story with an animated revision metric, trend visualization, and output checklist.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/content-section-four.json
Content Section One block

A restrained principles section with a clear introduction and a responsive set of supporting ideas.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/content-section-one.json
Content Section Three block

A structured feature grid with one dominant narrative and two focused supporting ideas.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/content-section-three.json
Content Section Two block

An editorial product story with balanced copy, configurable local media, and optional caption metadata.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/content-section-two.json
Contribution Graph ui

Clean contribution calendar with built-in normalization, keyboard navigation, and responsive latest-day visibility.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/contribution-graph.json
CTA Section One block

A polished call to action with primary and secondary links for clear next steps.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/cta-section-one.json
Designed for Focus Illustration component

An interactive focus illustration with concentric motion and reduced-motion support.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/designed-for-focus-illustration.json
Expandable Card ui

Composable card-dialog primitives with accessible modal behavior, controlled state, shared media motion, and custom actions.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/expandable-card.json
FAQ Section One block

A two-column FAQ layout with accessible accordion answers and a support prompt.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/faq-section-one.json
FAQ Section Three block

An editorial FAQ section with a large introduction and accessible accordion rows.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/faq-section-three.json
FAQs Section Two block

A centered FAQ section with accessible accordions and a follow-up contact link.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/faqs-section-two.json
Fast by Default Illustration component

An interactive field of animated speed lines with reduced-motion support.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/fast-by-default-illustration.json
Flexible at Scale Illustration component

An interactive spring-based line field that responds to pointer movement.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/flexible-at-scale-illustration.json
Footer Section One block

A multi-column product footer with social links and an email newsletter form.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/footer-section-one.json
Footer Section Two block

A compact navigation footer with product links, social actions, and legal copy.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/footer-section-two.json
Forgot Password One block

A compact password-recovery card with email input, submit action, and return link.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/forgot-password-one.json
Forgot Password Three block

A left-aligned password-recovery form with concise guidance and navigation back.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/forgot-password-three.json
Forgot Password Two block

A centered password-recovery form with a prominent heading and return action.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/forgot-password-two.json
Header Four block

A responsive header with animated multi-level desktop and mobile navigation menus.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/header-four.json
Header One block

A responsive marketing header with animated mobile navigation and account actions.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/header-one.json
Header Three block

A payment-product header with grouped navigation menus and a responsive mobile drawer.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/header-three.json
Header Two block

A responsive marketing header with a bordered shell and animated mobile menu.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/header-two.json
Hero Section Four block

A complete expense-workflow hero with responsive header, lead form, logo cloud, and supporting illustrations.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/hero-section-four.json
Hero Section One block

A dark product hero with badges, dual actions, and the matching responsive header.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/hero-section-one.json
Hero Section Three block

An art-directed hero with shader-backed visuals and a focused primary action.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/hero-section-three.json
Hero Section Two block

A motion-led hero with animated copy, grouped reveals, and its matching header.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/hero-section-two.json
Keyboard Shortcut ui

Interactive keyboard shortcut display with pressed-key feedback, callback handling, optional sound, and shadcn Kbd styling.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/keyboard-shortcut.json
Logo Cloud Five block

A headline-led animated logo cloud with responsive brand cards.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/logo-cloud-five.json
Logo Cloud Four block

A large animated company grid with a prominent trust statement.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/logo-cloud-four.json
Logo Cloud One block

A compact monochrome logo strip for customer or partner proof.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/logo-cloud-one.json
Logo Cloud Three block

A horizontally framed customer logo strip with restrained typography.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/logo-cloud-three.json
Logo Cloud Two block

A compact partner logo strip using a mixed icon and wordmark collection.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/logo-cloud-two.json
Magnetic Button ui

A shadcn-compatible button that subtly follows the cursor using spring-based motion.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/magnetic-button.json
Matching Panel Illustration component

A policy matching panel illustration.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/matching-panel.json
Package Manager Command ui

Accessible package-manager selector and copy command bar for npm, pnpm, yarn, and Bun.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/package-manager-command.json
Payment Card Illustration component

A motion-ready payment card illustration.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/payment-card.json
Pricing Section One block

A responsive three-tier pricing section with a monthly and yearly billing switcher.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/pricing-section-one.json
Proximity Nav ui

Route-aware sidebar navigation with pointer-responsive guide lines, controlled active state, and a navigation-free preview mode.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/proximity-nav.json
Rail Nav ui

Motion rail navigation with the original line-to-link reveal, controlled expansion, flexible links, and optional scroll tracking.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/rail-nav.json
Receipt Panel Illustration component

A receipt capture panel illustration.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/receipt-panel.json
Release Workflow Illustration component

An interactive release tracker with configurable workflow data and autoplay.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/release-workflow-illustration.json
Report Panel Illustration component

A report fetching panel illustration.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/report-panel.json
Revision Cycles Illustration component

An interactive comparison of eliminated and remaining revision rounds.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/revision-cycles-illustration.json
Segment Spotlight ui

Composable spotlight primitives with controlled state, animated segments, arbitrary controls, and hover or click activation.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/segment-spotlight.json
Sign Up One block

A detailed account creation form with identity, password, consent, and sign-in actions.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/sign-up-one.json
Sign Up Two block

A split-screen account creation flow with social sign-in, product benefits, and an animated visual.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/sign-up-two.json
Stats Section One block

A business results section that combines measurable outcomes with a customer proof point.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/stats-section-one.json
Teams Section Five block

A dark editorial team grid with role badges and portrait-led member cards.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/teams-section-five.json
Teams Section Four block

A global-team recruiting section with portrait cards and role badges.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/teams-section-four.json
Teams Section One block

A grouped leadership and team directory with social links and empty-state handling.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/teams-section-one.json
Teams Section Three block

A centered team directory with portrait cards, roles, and profile links.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/teams-section-three.json
Teams Section Two block

A simple responsive team grid with names, roles, and portrait imagery.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/teams-section-two.json
Workflow Desk Illustration component

A combined expense workflow illustration with a payment card and four process panels.

npx shadcn@latest add https://ui.navdeepsingh.dev/r/workflow-desk.json