{
"$schema": "https://ui.shadcn.com/schema/registry.json",
"name": "100xui",
"homepage": "https://100xui.com",
"items": [
{
"name": "parallax-cards",
"type": "registry:block",
"title": "Parallax cards",
"description": "A reusable and responsive component that gives each of its children a smooth parallax effect, adding a modern, interactive touch to your website. Perfect for showcasing lists of content blocks, feature cards, or image galleries.",
"files": [
{
"path": "registry/100xui/blocks/parallax-cards/components/parallax-cards.tsx",
"type": "registry:component"
}
],
"dependencies": ["motion"]
},
{
"name": "text-switcher",
"type": "registry:block",
"title": "Text switcher",
"description": "A reusable component that creates an engaging animation effect by smoothly transitioning between a list of phrases. The animation, driven by a moving dot, makes it ideal for dynamically completing a sentence or tagline.",
"files": [
{
"path": "registry/100xui/blocks/text-switcher/components/text-switcher.tsx",
"type": "registry:component"
}
],
"dependencies": ["motion"]
},
{
"name": "in-page-navbar",
"type": "registry:block",
"title": "In-page navbar",
"description": "A smart, fully responsive, and accessible navigation bar that tracks section progress as you scroll, providing a clear visual indicator of your journey through the page. Best suited for single-page layouts where all content lives on a single page.",
"files": [
{
"path": "registry/100xui/blocks/in-page-navbar/components/in-page-navbar.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/shared/hooks/use-is-server.ts",
"type": "registry:hook"
}
],
"dependencies": ["motion"]
},
{
"name": "motion-dock",
"type": "registry:block",
"title": "Motion Dock",
"description": "A reusable component where tooltips slide smoothly between dock items, making the motion dock feel natural and easy to use.",
"files": [
{
"path": "registry/100xui/blocks/motion-dock/components/motion-dock.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/shared/hooks/use-debounced-state.ts",
"type": "registry:hook"
},
{
"path": "registry/100xui/shared/hooks/use-previous.ts",
"type": "registry:hook"
}
],
"dependencies": ["motion"]
},
{
"name": "spinning-testimonials",
"type": "registry:block",
"title": "Spinning testimonials",
"description": "A sleek, reusable testimonial carousel that smoothly spins through any number of testimonials. Designed to be fully responsive, it automatically converts its direct children into carousel slides, making it perfect for highlighting customer feedback in a compact, eye-catching way.",
"registryDependencies": ["avatar"],
"files": [
{
"path": "registry/100xui/shared/hooks/use-in-view-interval.ts",
"type": "registry:hook"
},
{
"path": "registry/100xui/blocks/spinning-testimonials/components/ui/testimonial.tsx",
"type": "registry:ui"
},
{
"path": "registry/100xui/blocks/spinning-testimonials/components/spinning-carousel.tsx",
"type": "registry:component"
}
],
"dependencies": ["motion"]
},
{
"name": "motion-link",
"type": "registry:block",
"title": "Motion link",
"description": "Exclusive to Next.js. A reusable component that extends the component from \"next/link\" to power interactive animations using motion.dev. It includes three predefined variants: , , and , while the base provides full flexibility to define custom animations with MotionProps like whileFocus, whileHover, and whileInView.",
"files": [
{
"path": "registry/100xui/blocks/motion-link/components/motion-link.tsx",
"type": "registry:component"
}
],
"dependencies": ["motion"]
},
{
"name": "morph-modal",
"type": "registry:block",
"title": "Morph modal",
"description": "A reusable modal component that smoothly 'morphs' from the dimensions and position of its trigger element",
"files": [
{
"path": "registry/100xui/blocks/morph-modal/components/morph-modal.tsx",
"type": "registry:component"
}
],
"dependencies": ["motion"]
},
{
"name": "chat-bento-card",
"type": "registry:block",
"title": "Chat bento card",
"description": "A Bento chat interface card that mimics live chat interactions, great for embedding conversational UI demos in a Bento grid.",
"registryDependencies": ["avatar"],
"files": [
{
"path": "registry/100xui/blocks/chat-bento-card/components/chat-bento-card.tsx",
"type": "registry:component"
}
],
"dependencies": ["motion"]
},
{
"name": "notification",
"type": "registry:block",
"title": "Notification",
"description": "A reusable notification component that displays animated messages with smooth slide and scale transitions, perfect for in-app alerts, toasts, and contextual updates.",
"files": [
{
"path": "registry/100xui/blocks/notification/components/notification.tsx",
"type": "registry:component"
}
],
"dependencies": ["motion"]
},
{
"name": "iphone-3d-mockup",
"type": "registry:block",
"title": "iPhone 3D mockup",
"description": "A 3D iPhone mockup to beautifully showcase your app on landing pages. It is built purely with React and CSS with no external dependencies, keeping your site fast.",
"files": [
{
"path": "registry/100xui/blocks/iphone-3d-mockup/components/iphone-3d-mockup.tsx",
"type": "registry:component"
}
]
},
{
"name": "menu-wheel",
"type": "registry:block",
"title": "Menu wheel",
"description": "An interactive, animated radial menu that smoothly expands to reveal options in a circular layout. Powered by Motion, it features a fluid 'press, hover, and release' interaction model, making it perfect for housing grouped actions or quick-access settings in a compact, modern UI.",
"files": [
{
"path": "registry/100xui/blocks/menu-wheel/components/menu-wheel.tsx",
"type": "registry:component"
}
],
"dependencies": ["motion"]
},
{
"name": "apple-gallery",
"type": "registry:block",
"title": "Apple gallery",
"description": "An elegant, interactive media gallery inspired by Apple's iPhone 17 landing page. Designed with smooth transitions, interactive playback controls, and a highly polished user experience.",
"files": [
{
"path": "registry/100xui/blocks/apple-gallery/components/apple-gallery.tsx",
"type": "registry:component"
}
],
"registryDependencies": ["button"],
"dependencies": ["motion"]
},
{
"name": "internals",
"type": "registry:block",
"files": [
{
"path": "lib/utils.ts",
"type": "registry:lib"
},
{
"path": "app/styles/neutral.css",
"type": "registry:style"
},
{
"path": "registry/100xui/shared/components/ui/avatar.tsx",
"type": "registry:ui"
},
{
"path": "registry/100xui/shared/components/ui/button.tsx",
"type": "registry:ui"
}
]
},
{
"name": "demos",
"type": "registry:block",
"files": [
{
"path": "registry/100xui/blocks/parallax-cards/components/parallax-cards.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/spinning-testimonials/components/spinning-testimonials.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/motion-dock/components/motion-dock.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/motion-link/components/motion-link.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/in-page-navbar/components/in-page-navbar.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/morph-modal/components/morph-modal.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/text-switcher/components/text-switcher.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/notification/components/notification.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/chat-bento-card/components/chat-bento-card.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/apple-gallery/components/apple-gallery.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/iphone-3d-mockup/components/iphone-3d-mockup.demo.tsx",
"type": "registry:component"
},
{
"path": "registry/100xui/blocks/menu-wheel/components/menu-wheel.demo.tsx",
"type": "registry:component"
}
]
}
]
}