# UI Blocks & Snippets

> Copy-paste UI sections, blocks, snippets and animated components (landing sections, Tailwind snippets...).

- Parent category: [Frontend](https://devshelf.io/category/frontend.md)
- DevShelf page: https://devshelf.io/category/ui-blocks-snippets

## Resources (24)

- [Aceternity UI](https://devshelf.io/resource/aceternity-ui.md): A collection of production-ready React components, blocks and templates built with Tailwind CSS and Motion for modern interfaces. (pricing: Freemium)
- [Choc UI](https://devshelf.io/resource/choc-ui.md): A collection of accessible, responsive, and reusable UI components built for the Chakra UI framework. (pricing: Free)
- [CodeMyUI](https://devshelf.io/resource/codemyui.md): A curated collection of web design and development code snippets, including CSS, HTML, and JavaScript examples for UI elements and animations. (pricing: Free)
- [Copy & Paste CSS](https://devshelf.io/resource/copy-paste-css.md): A collection of CSS button designs and UI components sourced from popular design systems and brands for easy copying. (pricing: Free)
- [CSSnippets](https://devshelf.io/resource/cssnippets.md): A library of ready-to-use UI components and code snippets for HTML, React, CSS, and Tailwind CSS. (pricing: Free)
- [Formcn](https://devshelf.io/resource/formcn.md): A form builder for shadcn/ui that generates production-ready, maintainable code with Zod validation and multi-step support. (pricing: Free)
- [Frontendor](https://devshelf.io/resource/frontendor.md): A library of over 100 reusable UI blocks and templates for building landing pages using Bootstrap, featuring a copy-paste tool. (pricing: Paid)
- [GrayGrids](https://devshelf.io/resource/graygrids.md): A collection of website templates, UI components, and design resources for Tailwind CSS, Bootstrap, and HTML. (pricing: Freemium)
- [HyperUI](https://devshelf.io/resource/hyperui.md): A collection of free Tailwind CSS components for building application user interfaces, marketing websites, and e-commerce stores. (pricing: Free)
- [Indie UI](https://devshelf.io/resource/indie-ui.md): A collection of UI components and animation effects for web development. (pricing: Free)
- [KokonutUI](https://devshelf.io/resource/kokonutui.md): Open-source React and Tailwind CSS components with live previews and machine-readable registries for AI agents and developers. (pricing: Freemium)
- [Kometa UI Kit](https://devshelf.io/resource/kometa-ui-kit.md): A collection of over 130 responsive UI sections built with Tailwind CSS, available for HTML, Vue.js, and React projects. (pricing: Free)
- [Magic UI](https://devshelf.io/resource/magic-ui.md): Collection of animated components and visual effects built with React, TypeScript, Tailwind CSS, and Motion. (pricing: Freemium)
- [Nextjsshop](https://devshelf.io/resource/nextjsshop.md): Production-ready UI components and templates built with Next.js, Tailwind CSS, TypeScript, and React for web applications. (pricing: Freemium)
- [OpenHero](https://devshelf.io/resource/openhero.md): Collection of cinematic video background hero sections with source code in HTML, React, and Next.js. (pricing: Free)
- [PatternCraft](https://devshelf.io/resource/patterncraft.md): Library of 250+ CSS and Tailwind background patterns and gradients with one-click copy functionality. (pricing: Free)
- [Payload Components](https://devshelf.io/resource/payload-components.md): Open-source Payload CMS block registry and CLI tool that installs components with automatic collection wiring, render mapping, and type generation. (pricing: Free)
- [React Bits](https://devshelf.io/resource/react-bits.md): A collection of highly customizable, animated React components and backgrounds for creative web development. (pricing: Freemium)
- [Shadcn Templates](https://devshelf.io/resource/shadcn-templates.md): A curated directory of 600+ Shadcn UI templates, components, blocks, and boilerplates for modern web development. (pricing: Free)
- [Shadcnblocks](https://devshelf.io/resource/shadcnblocks.md): Collection of pre-built UI blocks, components, pages, and templates built for shadcn/ui and Tailwind CSS. (pricing: Freemium)
- [Skelementor](https://devshelf.io/resource/skelementor.md): Pre-made component library and layouts for the Elementor page builder in WordPress, offering navbars, hero sections, footers, and other UI elements. (pricing: Freemium)
- [Tailwind Plus](https://devshelf.io/resource/tailwind-plus.md): Collection of professionally designed UI components, website templates, and React UI kits built specifically for Tailwind CSS. (pricing: Paid)
- [TW Components](https://devshelf.io/resource/tw-components.md): Collection of 600+ free Tailwind CSS components and examples by Creative Tim for building user interfaces and web applications. (pricing: Free)
- [Uiverse](https://devshelf.io/resource/uiverse.md): A community-built open-source library of UI elements including buttons, loaders, cards, and forms for web development. (pricing: Free)

---

Source: DevShelf.io, the hand-reviewed catalog of dev tools and resources. Every resource is reviewed by hand before it is listed.