[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"categories-en-US":3,"blog-categories-en-US":3,"resource-hero-ui-en-US":4,"featured-sidebar-data-en-US":3,"latest-resources-en-US":48,"alternatives-hero-ui-en-US":116,"related-resources-hero-ui-en-US":183},true,{"id":5,"name":6,"slug":7,"url":8,"date_updated":9,"images_other":10,"tagline":11,"description":12,"seo":13,"features":15,"pros":20,"cons":24,"best_for":27,"cover":28,"icon":29,"pricing":30,"platform":10,"github_url":10,"twitter_url":10,"discord_url":10,"dribbble_url":10,"pricing_tiers":31,"views_count":32,"featured_rank":10,"categories":33,"tags":42,"files":44},264,"Hero UI","hero-ui","https:\u002F\u002Fwww.heroui.com\u002F","2025-11-12T02:54:32.445+00:00",null,"Beautiful, fast and modern React UI library for building accessible and customizable web applications.","HeroUI offers a variety of UI blocks, components, and templates built with Tailwind CSS, aiming to accelerate web development, especially for projects utilizing Tailwind CSS.",{"title":14,"description":11},"Hero UI - Beautiful, fast and modern React UI library for building accessible and customizable web applications. | DesignToolMark",[16,17,18,19],"Comprehensive component library","Design tokens","Documentation included","Theme customization",[21,22,23],"Ready-to-use templates","Comprehensive design system","Streamlines workflow",[25,26],"Adoption requires team alignment","Customization can be complex","Teams building scalable, consistent digital products.","795eb9ae-d74c-49bd-8f13-9fb6225f087c.webp","d2cc0901-b10b-412b-9551-d98b76390284.svg","free",{"free":3},0,[34,38],{"name":35,"slug":36,"sub_categories":37},"Design Systems","design-systems",[],{"name":39,"slug":40,"sub_categories":41},"Templates & UI Kits","templates-ui-kits",[],[43],{"name":35,"slug":36},[45],{"url":46,"type":47},"https:\u002F\u002Fwww.figma.com\u002Fcommunity\u002Ffile\u002F1267584376234254760","figma",[49,68,84,102],{"id":50,"url":51,"icon":10,"name":52,"slug":53,"tags":54,"cover":64,"tagline":65,"is_featured":66,"date_created":67,"date_updated":10},670,"https:\u002F\u002Fattentioninsight.com","Attention Insight","attention-insight",[55,57,59,61],{"seo":10,"name":10,"slug":56},"wireframe",{"seo":10,"name":10,"slug":58},"user-research",{"seo":10,"name":10,"slug":60},"web-design",{"seo":10,"name":62,"slug":63},"Freemium","freemium","ef36c4d0-cade-4956-a397-b7c4436ad473.webp","AI-powered attention prediction and visual analytics",false,"2026-06-17T09:18:38.384779+00:00",{"id":69,"url":70,"icon":10,"name":71,"slug":72,"tags":73,"cover":81,"tagline":82,"is_featured":66,"date_created":83,"date_updated":10},669,"https:\u002F\u002Fwww.frontitude.com","Frontitude","frontitude",[74,75,76,78,80],{"seo":10,"name":10,"slug":56},{"seo":10,"name":10,"slug":58},{"seo":10,"name":10,"slug":77},"collaboration",{"seo":10,"name":10,"slug":79},"design-handoff",{"seo":10,"name":62,"slug":63},"5237122f-f736-4899-bd25-2002bf09dec2.webp","UX content management platform for multilingual products","2026-06-17T09:18:30.634258+00:00",{"id":85,"url":86,"icon":10,"name":87,"slug":88,"tags":89,"cover":99,"tagline":100,"is_featured":66,"date_created":101,"date_updated":10},668,"https:\u002F\u002Fwww.aura.build","Aura Build","aura-build",[90,91,93,94,96,98],{"seo":10,"name":10,"slug":56},{"seo":10,"name":10,"slug":92},"prototyping",{"seo":10,"name":10,"slug":60},{"seo":10,"name":10,"slug":95},"responsive",{"seo":10,"name":10,"slug":97},"icons",{"seo":10,"name":62,"slug":63},"be6ec3d1-5806-4cf8-bc58-5d536af6c04d.webp","AI-powered website builder and design assistant","2026-06-17T09:18:13.351637+00:00",{"id":103,"url":104,"icon":10,"name":105,"slug":106,"tags":107,"cover":113,"tagline":114,"is_featured":66,"date_created":115,"date_updated":10},667,"https:\u002F\u002Fwww.magicpatterns.com","Magic Patterns","magic-patterns",[108,109,110,111,112],{"seo":10,"name":10,"slug":56},{"seo":10,"name":10,"slug":92},{"seo":10,"name":10,"slug":77},{"seo":10,"name":10,"slug":79},{"seo":10,"name":62,"slug":63},"6d6649e5-e83d-44c6-bdf0-91d6cb530736.webp","AI prototype generator for product teams","2026-06-17T09:18:05.299046+00:00",[117,123,129,135,141,147,153,159,165,171,177],{"url":118,"name":119,"slug":120,"cover":121,"tagline":122},"https:\u002F\u002Ftailwindcss.com\u002Fplus","Tailwind UI Blocks","tailwind-ui-blocks","4e383b64-9b01-4b4d-af66-0bbd07b19419.webp","Tailwind UI Blocks offer pre-built UI components and layouts based on Tailwind CSS, accelerating your web development for beautiful and responsive designs.",{"url":124,"name":125,"slug":126,"cover":127,"tagline":128},"https:\u002F\u002Fui.nuxt.com\u002F","Nuxt UI","nuxt-ui","f2abda49-a137-4a30-9fc6-73b24f26a1a1.webp","Nuxt UI is an open-source UI component library designed for Nuxt 3 applications, offering beautiful, customizable, and accessible Vue components.",{"url":130,"name":131,"slug":132,"cover":133,"tagline":134},"https:\u002F\u002Fvuetifyjs.com\u002F","Vuetify","vuetify","screenshots\u002Fvuetify.webp","Vuetify is a complete Vue.js UI framework that strictly adheres to Material Design guidelines, offering a rich set of components and powerful customization capabilities.",{"url":136,"name":137,"slug":138,"cover":139,"tagline":140},"https:\u002F\u002Fui.shadcn.com\u002F","shadcn\u002Fui","shadcn-ui","dd0a4029-629e-4e5d-9765-d33af6f31794.webp","shadcn\u002Fui is a unique collection of composable React UI components, offering copy-and-paste code that is highly customizable and seamlessly integrates with Tailwind CSS.",{"url":142,"name":143,"slug":144,"cover":145,"tagline":146},"https:\u002F\u002Fmui.com\u002F","MUI","mui","bed9b944-a96c-4bb2-892d-f818f221f053.webp","MUI is a UI component library specifically designed for React applications. It provides a vast array of ready-to-use React components for building user interfaces, following React's declarative programming paradigm.",{"url":148,"name":149,"slug":150,"cover":151,"tagline":152},"https:\u002F\u002Fanimate-ui.com\u002F","Animate UI","animate-ui","51875bb1-cd07-4d4b-b76c-940dab1c9780.webp","Animate UI is a free open-source React component library with Tailwind and Framer Motion animations, inspired by shadcn\u002Fui, to effortlessly elevate web interfaces.",{"url":154,"name":155,"slug":156,"cover":157,"tagline":158},"https:\u002F\u002Fflowbite.com\u002F","Flowbite Design System","flowbite-design-system","1fc705b7-2a78-4a13-ae72-b6fbf30933be.webp","open-source Tailwind CSS component library with Figma kit for rapid UI building.",{"url":160,"name":161,"slug":162,"cover":163,"tagline":164},"https:\u002F\u002Fant.design\u002F","Ant Design","ant-design","46e77f76-13b9-4032-93fd-30c2bddda508.webp","Ant Design is an enterprise-level UI design language and React component library, providing high-quality UI solutions to help build elegant and efficient enterprise products.",{"url":166,"name":167,"slug":168,"cover":169,"tagline":170},"https:\u002F\u002Fchakra-ui.com\u002F","Chakra UI","chakra-ui","c663e14b-ed3e-4890-a479-b6839b558313.webp","Chakra UI is a simple, modular, and accessible React UI component library, focused on enhancing developer experience and providing highly customizable building blocks.",{"url":172,"name":173,"slug":174,"cover":175,"tagline":176},"https:\u002F\u002Fwww.naiveui.com\u002F","Naive UI","naive-ui","c0549a7c-6a36-442d-bc7c-986f1829b43e.webp","Naive UI is a Vue 3 component library recommended by Evan You, offering beautiful, high-performance, and highly customizable components, entirely written in TypeScript.",{"url":178,"name":179,"slug":180,"cover":181,"tagline":182},"https:\u002F\u002Felement-plus.org\u002F","Element Plus","element-plus","0474b1f2-6bdb-4aa5-99ac-f72a69517f6f.webp","Element Plus is a desktop UI component library designed for Vue 3, offering rich, elegant enterprise-grade components to efficiently build management systems.",[184,198,210],{"url":185,"icon":10,"name":186,"slug":187,"tags":188,"cover":195,"tagline":196,"is_featured":10,"date_created":197,"date_updated":10},"https:\u002F\u002Fzeroheight.com","Zeroheight","zeroheight",[189,190,191,192,193],{"seo":10,"name":10,"slug":36},{"seo":10,"name":10,"slug":77},{"seo":10,"name":10,"slug":92},{"seo":10,"name":10,"slug":79},{"seo":10,"name":10,"slug":194},"figma-file","8f4828c0-3236-44df-9cce-4b74ad2700f7.webp","Living design system documentation — connect Figma to code with interactive docs","2026-06-16T07:16:42.647437+00:00",{"url":199,"icon":10,"name":200,"slug":201,"tags":202,"cover":207,"tagline":208,"is_featured":10,"date_created":209,"date_updated":10},"https:\u002F\u002Fspecifyapp.com","Specify","specify",[203,204,206],{"seo":10,"name":10,"slug":77},{"seo":10,"name":10,"slug":205},"version-control",{"seo":10,"name":10,"slug":79},"ac2bb029-95df-4617-97ca-6051f5dccfc1.webp","Design token platform that pushes your design decisions to code — automatically","2026-06-16T07:14:19.135613+00:00",{"url":130,"icon":211,"name":131,"slug":132,"tags":212,"cover":133,"tagline":134,"is_featured":10,"date_created":214,"date_updated":215},"bd46950f-9a47-4d81-95da-ed6467288051.svg",[213],{"seo":10,"name":10,"slug":36},"2025-10-15T08:20:56.561+00:00","2026-06-12T06:51:44.386368+00:00"]