[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"categories-en-US":3,"blog-categories-en-US":3,"resource-native-base-design-system-en-US":4,"featured-sidebar-data-en-US":3,"latest-resources-en-US":52,"alternatives-native-base-design-system-en-US":127,"related-resources-native-base-design-system-en-US":187},true,{"id":5,"name":6,"slug":7,"url":8,"date_updated":9,"images_other":9,"tagline":10,"description":11,"seo":12,"features":15,"pros":21,"cons":26,"best_for":29,"cover":30,"icon":31,"pricing":32,"platform":33,"github_url":9,"twitter_url":9,"discord_url":9,"dribbble_url":9,"pricing_tiers":37,"views_count":38,"featured_rank":9,"categories":39,"tags":44,"files":48},454,"NativeBase Design System","native-base-design-system","https:\u002F\u002Fnativebase.io\u002F",null,"open-source UI component library for React Native with customizable, accessible cross-platform designs.","NativeBase is an open-source, universal design system and UI component library for React Native and web, enabling developers to build consistent, accessible, and performant mobile and web applications with ready-to-use components. It supports theming, dark mode, and platform-specific adaptations (iOS\u002FAndroid\u002Fweb), making it ideal for cross-platform development without separate codebases. With over 50k GitHub stars, it's widely used for rapid prototyping and production apps, offering extensive customization through theme tokens and utility props.\nComponent Library: 40+ pre-built components like buttons, forms, cards, navigation, modals, and lists with variants.\nTheming: Highly customizable themes using tokens for colors, typography, spacing, and shadows.\nAccessibility: Built-in ARIA support, focus management, and screen reader compatibility.\nCross-Platform: Works seamlessly on React Native (iOS\u002FAndroid) and web (React).\nTools: NativeBase Provider for global theming; integration with Expo and Next.js.",{"title":13,"meta_description":14},"NativeBase Design System - open-source UI component library for React Native with customizable, accessible cross-platform designs. | DesignToolMark","NativeBase is an opensource, universal design system and UI component library for React Native and web, enabling developers to build consistent, accessible, ...",[16,17,18,19,20],"Component Library: 40+ pre-built components like buttons, forms, cards, navigation, modals, and lists with variants.","Theming: Highly customizable themes using tokens for colors, typography, spacing, and shadows.","Accessibility: Built-in ARIA support, focus management, and screen reader compatibility.","Cross-Platform: Works seamlessly on React Native (iOS\u002FAndroid) and web (React).","Tools: NativeBase Provider for global theming; integration with Expo and Next.js.",[22,23,24,25],"Open source","Color palette generation","Accessibility contrast checking","Comprehensive design system",[27,28],"Adoption requires team alignment","Customization can be complex","Teams building scalable, consistent digital products.","3f441d33-8c8a-4c12-8688-40e441a2c25e.webp","3768d1ca-e470-41c2-a217-4c2547c0c7ea.svg","free",[34,35,36],"Browser","iOS","Android",{"free":3},0,[40],{"name":41,"slug":42,"sub_categories":43},"Design Systems","design-systems",[],[45,47],{"name":46,"slug":32},"Free",{"name":41,"slug":42},[49],{"url":50,"type":51},"https:\u002F\u002Fwww.figma.com\u002Fcommunity\u002Ffile\u002F1098591432716522150\u002Fnativebase-v3-4-design-kit","figma",[53,73,88,101],{"id":54,"url":55,"icon":9,"name":56,"slug":57,"tags":58,"cover":69,"tagline":70,"is_featured":71,"date_created":72,"date_updated":9},862,"https:\u002F\u002Fdeveloper.apple.com\u002Fdesign\u002Fresources\u002F","Apple Design Resources","apple-design-resources",[59,60,62,64,66,68],{"seo":9,"name":46,"slug":32},{"seo":9,"name":9,"slug":61},"fonts",{"seo":9,"name":9,"slug":63},"icons",{"seo":9,"name":9,"slug":65},"mockups",{"seo":9,"name":9,"slug":67},"ui-kits",{"seo":9,"name":9,"slug":42},"39af338d-2e06-4c05-bfcb-b33066ed9bb7.webp","Official Apple design templates, UI kits, fonts, and tools",false,"2026-07-16T01:44:01.585569+00:00",{"id":74,"url":75,"icon":9,"name":76,"slug":77,"tags":78,"cover":85,"tagline":86,"is_featured":71,"date_created":87,"date_updated":9},861,"https:\u002F\u002Fferalui.dev\u002Fgradients","FeralUI Gradient Builder","feralui-gradients",[79,80,83],{"seo":9,"name":46,"slug":32},{"seo":9,"name":81,"slug":82},"Open Source","open-source",{"seo":9,"name":9,"slug":84},"colors","7ebaf15a-33a1-4f03-bd92-88ad52b886e5.webp","Playful, physics-driven gradient builder for Tailwind CSS","2026-07-16T01:39:25.742464+00:00",{"id":89,"url":90,"icon":9,"name":91,"slug":92,"tags":93,"cover":98,"tagline":99,"is_featured":71,"date_created":100,"date_updated":9},860,"https:\u002F\u002Fviewport-ui.design\u002F","Viewport UI","viewport-ui",[94,95,96],{"seo":9,"name":46,"slug":32},{"seo":9,"name":9,"slug":67},{"seo":9,"name":9,"slug":97},"inspiration","7a4e7938-e9b1-4f8b-9886-37b683ddd8f6.webp","UI curated experiences for your inspiration","2026-07-07T06:28:48.469215+00:00",{"id":102,"url":103,"icon":9,"name":104,"slug":105,"tags":106,"cover":124,"tagline":125,"is_featured":71,"date_created":126,"date_updated":9},859,"https:\u002F\u002F21st.dev\u002F","21st.dev","21st-dev",[107,110,112,113,116,117,118,120,122],{"seo":9,"name":108,"slug":109},"AI Powered","ai-powered",{"seo":9,"name":9,"slug":111},"ai",{"seo":9,"name":46,"slug":32},{"seo":9,"name":114,"slug":115},"Freemium","freemium",{"seo":9,"name":9,"slug":67},{"seo":9,"name":9,"slug":42},{"seo":9,"name":9,"slug":119},"prototyping",{"seo":9,"name":9,"slug":121},"no-code",{"seo":9,"name":9,"slug":123},"productivity","79e67612-7a6f-45be-a799-e872786fc4ed.webp","Hand-crafted React components and templates — not AI slop","2026-07-07T06:23:36.061553+00:00",[128,134,140,146,152,158,164,170,176,182],{"url":129,"name":130,"slug":131,"cover":132,"tagline":133},"https:\u002F\u002Fhorizon.servicenow.com\u002F","Horizon Design System","horizon-design-system","1029d4f0-63f9-4111-8f8c-c1d34fddda0a.webp","HashiCorp's open-source design system for consistent, accessible cloud management interfaces.",{"url":135,"name":136,"slug":137,"cover":138,"tagline":139},"https:\u002F\u002Fm3.material.io\u002F","Material Design","material-design","9ac1a8c0-b24f-4e26-abab-f5bbdb080afa.webp","Google's open-source design system for consistent, intuitive interfaces across platforms.",{"url":141,"name":142,"slug":143,"cover":144,"tagline":145},"https:\u002F\u002Flearn.microsoft.com\u002Fen-us\u002Fmicrosoftteams\u002Fplatform\u002Fconcepts\u002Fdesign\u002Fdesign-teams-app-basic-ui-components","Microsoft Teams UI Kit","microsoft-teams-ui-kit","b9783ef1-ff6f-4411-9c33-dde957106821.webp","Figma-based components and templates for designing consistent Teams apps.",{"url":147,"name":148,"slug":149,"cover":150,"tagline":151},"https:\u002F\u002Fwww.figma.com\u002Fcommunity\u002Ffile\u002F928108847914589057","Figma UI2","figma-ui-2","c6712166-b324-4c90-820f-c2f773a44ac1.webp","Figma's official design system for consistent, accessible product interfaces.",{"url":153,"name":154,"slug":155,"cover":156,"tagline":157},"https:\u002F\u002Fmoondesignsystem.com\u002F","Moon Design System","moon-design-system","98a03427-305d-4b4f-9ff3-75d7355da784.webp","open-source UI framework for consistent, customizable digital experiences.",{"url":159,"name":160,"slug":161,"cover":162,"tagline":163},"https:\u002F\u002Fnewskit.co.uk\u002F","NewsKit","news-kit","f4b41300-39f8-4c94-8f02-8291169b9262.webp","News UK's open-source design system for consistent, accessible digital news experiences.",{"url":165,"name":166,"slug":167,"cover":168,"tagline":169},"https:\u002F\u002Forbit.kiwi\u002F","Orbit","orbit","ca0024d4-524d-4f26-9f4c-4ecb534bf93a.webp","Kiwi.com's open-source design system for consistent, accessible travel booking interfaces.",{"url":171,"name":172,"slug":173,"cover":174,"tagline":175},"https:\u002F\u002Fdesign.gitlab.com\u002F","Pajamas","pajamas","6df3ce4e-0bfa-4305-8480-02e2151c1c56.webp","GitLab's open-source design system for consistent, accessible interfaces across products.",{"url":177,"name":178,"slug":179,"cover":180,"tagline":181},"https:\u002F\u002Fux.palmetto.com\u002F","Palmetto Design System","palmetto-design-system","f50abbab-5c4c-4f0a-aabf-8ec395fdd81c.webp","open-source design system for consistent, accessible solar energy product interfaces.",{"url":183,"name":184,"slug":184,"cover":185,"tagline":186},"https:\u002F\u002Fgluestack.io\u002F","gluestack-ui","5a546b62-0e4c-4f7b-afd7-90b343d10bdb.webp","open-source universal React UI library with customizable, accessible components for web and native apps.",[188,196,207],{"url":55,"icon":9,"name":56,"slug":57,"tags":189,"cover":69,"tagline":70,"is_featured":71,"date_created":72,"date_updated":9},[190,191,192,193,194,195],{"seo":9,"name":46,"slug":32},{"seo":9,"name":9,"slug":61},{"seo":9,"name":9,"slug":63},{"seo":9,"name":9,"slug":65},{"seo":9,"name":9,"slug":67},{"seo":9,"name":9,"slug":42},{"url":103,"icon":9,"name":104,"slug":105,"tags":197,"cover":124,"tagline":125,"is_featured":71,"date_created":126,"date_updated":9},[198,199,200,201,202,203,204,205,206],{"seo":9,"name":108,"slug":109},{"seo":9,"name":9,"slug":111},{"seo":9,"name":46,"slug":32},{"seo":9,"name":114,"slug":115},{"seo":9,"name":9,"slug":67},{"seo":9,"name":9,"slug":42},{"seo":9,"name":9,"slug":119},{"seo":9,"name":9,"slug":121},{"seo":9,"name":9,"slug":123},{"url":208,"icon":9,"name":209,"slug":210,"tags":211,"cover":217,"tagline":218,"is_featured":71,"date_created":219,"date_updated":9},"https:\u002F\u002Fflareum.io\u002F","Flareum","flareum",[212,213,215],{"seo":9,"name":9,"slug":42},{"seo":9,"name":9,"slug":214},"figma-file",{"seo":9,"name":9,"slug":216},"collaboration","7ce196b0-b5f3-49d4-ba83-cdff08424942.webp","Design system builder that syncs Figma and code","2026-06-23T12:06:17.661232+00:00"]