The best Figma UI kits for mobile apps in 2026

The best mobile design system for Figma in 2026 is Appetite UI when one app ships on iOS and Android: it is a Figma UI kit for iOS and Android apps, built like a design system, and its Apple and Material components read the same tokens, so a rebrand is one edit for both platforms. For one platform the free official kits come first, Apple's iOS and iPadOS 27 UI kit for iPhone and iPad and Google's Material 3 Design Kit for Android, and the other kits fit narrower cases: Dynamic Layer and Xela UI for components as code, Setproduct Mobile X and Nucleus UI for ready templates, Untitled UI and AlignUI for a web product.

I design Appetite UI, so the first entry is my own product. It is first because this list is ranked for one app on iOS and Android, the case it is built for; for an app on one platform the official kits come first.

Last verified: November 2026. Every starting price in the table below was read again on its maker's page on November 3, 2026, except the Material 3 Design Kit's, whose Figma Community page did not open that day and keeps the October 30, 2026 reading. The other facts on this page were read on October 30, 2026.

Prices as each maker's page printed them on the day shown under each, the lowest tier first, with the page each was read on; “once” is a one-time payment. Check the page before you buy, prices move.

How this list was made.

• Who wrote it. Bob Poláček, who designs Appetite UI with the bpolacek.cz studio team and external collaborators. Appetite UI is the author's product, and this page says so before the list.
• What was checked. Nine checks for one app on iOS and Android, below, each one a sentence a maker's public page either states or does not. The checklist answers the five checks an assistant asks of any kit, with Appetite UI's proof.
• When. Every other kit's page was read again on October 30, 2026, and the starting prices again on November 3, 2026; every fact names the page it was read on, listed under Sources. Appetite UI's facts link its public docs.
• The rules. Only a maker's own words; prices only as the maker's page printed them, with the day; no count or rating of another kit; where a page is silent the scorecard says Not on its page, never No; and the rebrand test below works on any kit you can open in Figma.

1. Appetite UI, the pick for one system across iOS and Android. It is one system for both platforms: Apple and Material components read the same tokens, a Platform mode switches the measures that differ, light and dark are variable modes, and the tokens export to SwiftUI, Jetpack Compose, Flutter and CSS. It is not for the web.
2. Apple's iOS and iPadOS 27 UI kit, the free pick for an app on iPhone and iPad only. It is Apple's own drawing of its components, overhauled for iOS 27, and Apple's license limits it to mock-ups of software for Apple's platforms.
3. Google's Material 3 Design Kit, the free pick for an Android app only. It is Google's own kit, "Compose-first" since version 1.25, themed with the Material Theme Builder plugin and licensed under CC BY 4.0.
4. Dynamic Layer, best if the app is built in Flutter and you want the components as code. It sells Figma components, screen templates and Flutter code; its page names iOS and Android templates and no switch between the two.
5. Xela UI, best if you want coded components for several frameworks at once. It sells React, Flutter, SwiftUI and Jetpack Compose components beside its Figma file, for "desktop & mobile apps".
6. Setproduct Mobile X, best if you want ready app templates in one Figma file. Its templates are, in its words, "based on iOS specs adopted for 8dp Android grid", and its dark theme is "made with Variants".
7. Nucleus UI, best if one Figma kit has to cover an app and its website. It holds mobile app screens and web pages in one kit "designed exclusively for Figma", with light and dark on variables and a free Lite version.
8. Untitled UI, best if the product is a web app, a dashboard or a marketing site. It is a Figma UI kit and a React component library "to design and develop modern UI and websites".
9. AlignUI, best if you build a web product in React and Tailwind CSS. It is a web design system "Built for React", with an "Up-to-date Figma file synced with code library".

The list is ranked for one app that ships on iOS and Android.

A Figma UI kit for iOS and Android has screens or components for both platforms. One system for both platforms is more than that: Apple's components and Material's read the same tokens, so a brand color, a type size or a radius is written once, and a mode switches the values that differ between the platforms, such as a 44 pt touch target on iOS and 48 dp on Android, without a second library. The bars, sheets and primary action are still drawn once per platform, because that is where Apple and Google disagree. With two sets of screens, how many edits a rebrand takes depends on how each set was built; in one system it is one edit.

The checks below follow from that case. Each one can be read off a maker's public page, which is why the scorecard has a third answer beside Yes and No.

• iOS and Android. The page says the kit is for iOS and Android apps.
• Apple and Material components. The page names components drawn to Apple's conventions and to Material's, not one design adapted to both.
• One system for both. Both platforms read one set of tokens, and a mode switches the values that differ between them.
• Dark as a variable mode. Light and dark are modes of the same variables, so a whole frame switches at once.
• Brand in variables. Color, type, spacing or radius live in variables or tokens, so a rebrand is an edit to them.
• Token values for code. The token values come with the kit in a format developers use.
• Component code. Coded components come with the kit or beside it.
• App screens. Finished app screens or templates come in the file.
• Look before paying. The file, a preview of it or a free version can be opened before paying.

Price is not one of the checks, so the list does not rank by it: the starting prices are in the table at the top, as each maker's page printed them, read again on November 3, 2026, and Appetite UI's plans are on pricing. No counts or ratings of anybody else's product appear here, because several of their pages disagree with themselves on counts.

A mobile kit proves itself at the rebrand, the second platform and the handoff.

Every kit looks finished on its cover. The differences show up later, in three moments most apps go through: the brand color changes, a second platform is added, and a developer asks for the values. Run these checks on a kit's own page, and in its free file or preview if it has one, before you pick it.

For what a variable mode does that a duplicated frame cannot, see Dark mode with Figma variables, not duplicate frames, and for ten questions to ask of any kit with a five minute test each, the buyer's guide.

The scorecard puts every kit through the same checks.

The rows are in the order of the shortlist, and the checks are split in two tables: the platform checks first, then the file and what a developer gets. Each kit's section below lists what every answer in its row rests on.

Checked on October 30, 2026, against each maker's own public pages. Not stated means the page does not say it, which is not the same as the kit lacking it.

Checked on October 30, 2026, against each maker's own public pages. Not stated means the page does not say it, which is not the same as the kit lacking it.

Appetite UI keeps iOS and Android on one token source.

This is the entry I make, so here is what it does and what it does not.

Appetite UI is a Figma UI kit for iOS and Android apps, built like a design system. One token source drives Apple and Material components in light and dark mode, and exports to SwiftUI, Jetpack Compose, Flutter and CSS.

Appetite UI puts Apple and Material components in one Figma file and binds both to the same tokens. The Apple components fill 20 pages of the file and the Material 3 components 17, each drawn to its own platform's conventions (iOS, Material 3). The Platform Bridge holds 113 variables: 53 Apple slots and 60 Material slots for color, shape and type size. In Brand mode each slot points at your tokens, so iOS/tintColor and M3/sys/color/primary end on the same brand primitive, and one edit moves an iOS screen and an Android screen together. In System mode the same slots return the values Apple and Google publish, so you can hold a screen against the official baseline without redrawing it. Light and Dark are two modes on the same semantic tokens, and the file runs on 589 variables in 6 collections.

The measures that differ live in the Platform collection: 20 variables in five modes, ios-md, ios-lg, android, ios-duo-outer and ios-duo-inner, so the same component reads a 44 pt touch target on iOS and 48 dp on Android, and a frame changes platform with one dropdown (dimensions). Bars, sheets and the primary action are drawn for each platform, because that is where the platforms disagree.

The token source is one file in the W3C Design Tokens format, and its SwiftUI, Jetpack Compose, Flutter and CSS outputs come in the Figma file (code output). Those outputs are values. Appetite UI Code adds the components: every one in React Native, with an App Starter, and the core set in SwiftUI, Flutter and Jetpack Compose; How one Figma token becomes SwiftUI, Compose, Flutter and CSS follows one token through all four. The app screens for finance, booking, fitness, social and AI apps are assembled from the same components in light and dark, with iPhone Duo pairs for 8 apps, and the Core Skill, included with the file, tells an AI agent which token to reach for. Appetite UI Complete is the Figma file and the code together, and each license is paid once, with lifetime updates (pricing).

What it leaves out: no Apple artwork, SF Symbols or San Francisco typeface (the file is drawn in Inter with Lucide icons), and nothing for the web. Its variable modes need a paid Figma plan. You can check the Figma file before paying: the full file has a read-only preview, and the docs state every token and component. The free code base holds a short React Native set, not the whole kit.

Where other kits beat Appetite UI

• One stack, end to end. Dynamic Layer is Flutter, Xela UI sells SwiftUI, Jetpack Compose, Flutter and React, and gluestack UI is React Native with components to copy in. Appetite UI Code has every component in React Native, with an App Starter, and the core set in SwiftUI, Flutter and Jetpack Compose.
• The web. Appetite UI has no web or desktop layouts. Untitled UI and AlignUI are built for web apps and dashboards, and Nucleus UI covers an app and its website in one kit.
• Apple's exact components. Apple's iOS and iPadOS 27 UI kit is Apple's own drawing, with SF Symbols and the San Francisco typeface beside it; Appetite UI is drawn in Inter with Lucide icons. For an iPhone-only app that has to look exactly like iOS, Apple's kit is the reference.
• Android on Google's baseline. Google's Material 3 Design Kit follows each Material release first and comes with Jetpack Compose snippets.
• Price for one platform. Apple's and Google's kits state no price on their pages; Appetite UI is paid.

• iOS and Android: Yes. iPhone, Android phones and iPhone Duo, on 20 Platform variables in five modes: ios-md, ios-lg, android, ios-duo-outer and ios-duo-inner. (appetiteui.com/docs/dimensions)
• Apple and Material components: Yes. 20 pages of Apple components and 17 of Material 3 components, each drawn to its own platform's conventions: 67 Apple and 44 Material component sets. (appetiteui.com/docs/ios)
• One system for both: Yes. Both component sets read one token set through the Platform Bridge, 113 variables (53 Apple and 60 Material slots), so iOS/tintColor and M3/sys/color/primary end on the same brand token. The Platform mode switches touch targets, bar heights and corners, 44 pt on iOS and 48 dp on Android. Bars, sheets and the primary action are drawn once per platform. (appetiteui.com/docs/platform-bridge)
• Dark as a variable mode: Yes. Light and Dark are two modes of the 190 Color Tokens, so a frame switches with one setting. (appetiteui.com/docs/colors)
• Brand in variables: Yes. The brand color is written once, in brand/base. Repointing it recolored 1,110 layers across components, app screens and charts, on both platforms and in both modes, counted in the file on October 8, 2026. (appetiteui.com/blog/rebrand-mobile-app-figma-variables)
• Token values for code: Yes. One token file in the W3C Design Tokens format, with SwiftUI, Jetpack Compose, Flutter and CSS outputs, in the file you buy. (appetiteui.com/docs/code-output)
• Component code: Yes. Appetite UI Code ships every component in React Native, with an App Starter, and the core set in SwiftUI, Flutter and Jetpack Compose. The Figma file also exports token values. (appetiteui.com/code)
• App screens: Yes. App screens for finance, booking, fitness, social, AI, tasks and more in light and dark, and iPhone Duo pairs for 8 apps, built from the same components. (appetiteui.com/screens)
• Look before paying: Yes. A read-only preview of the whole file, and public docs for every token and component. (appetiteui.com/docs/introduction)

Pick it when the same app also ships on Android, or when your brand has to sit on top of the system. An app on one platform today works too: the other mirror reads the same tokens and waits in the file.

Apple's iOS and iPadOS 27 kit is the reference for iPhone.

Use Apple's kit if you ship on iOS only and want Apple's exact components.

Apple describes it in one sentence: "Apple's iOS and iPadOS 27 UI kit for Figma helps you quickly and easily create highly accurate iPhone and iPad design comps and user flows." It contains, in Apple's words, "components for all common controls and views, design templates, text styles, color styles, and materials", and for this release it "was fully overhauled to support iOS and iPadOS 27 changes including updates to Liquid Glass, layout, sidebar colors, scroll edge effects, and more." Apple announced the 27 design kits on June 23, 2026, and the Figma Community file shows an update on October 28, 2026. Apple's Design Resources page lists it for download for Figma and for Sketch, and no page of Apple's states a price.

It is Apple's own drawing of Apple's controls, so for an iPhone-only app it is the file everything else gets compared against. The file asks you to "install the latest version of SF Symbols before using this library", and its Figma Community page links the License Agreement for Apple Design Resources, whose section 2A reads:

"you are granted a limited, non-transferable, non-exclusive license to use the Apple Design Resources solely for creating mock-ups of user interfaces designed for use in software products that run only on Apple's macOS, iOS, watchOS, tvOS, and/or visionOS operating system software"

License Agreement for Apple Design Resources, LYL142, 06/21/2023, read October 14, 2026; the Community page still links this version on October 30, 2026.

• iOS and Android: No. Its license grants use "solely for creating mock-ups of user interfaces designed for use in software products that run only on Apple's macOS, iOS, watchOS, tvOS, and/or visionOS operating system software", so not for Android. (developer.apple.com/support/downloads/terms/apple-design-resources/Apple-Design-Resources-License-20230621-English.pdf)
• Apple and Material components: Not on its page. Not on its page: Apple names "components for all common controls and views" for "iPhone and iPad design comps and user flows" and no Material components. (figma.com/community/file/1651309003795292092/ios-and-ipados-27)
• One system for both: Not on its page. One platform, so nothing switches between two. (figma.com/community/file/1651309003795292092/ios-and-ipados-27)
• Dark as a variable mode: Not on its page. Apple's text lists "text styles, color styles, and materials" and does not say how dark mode switches. (figma.com/community/file/1651309003795292092/ios-and-ipados-27)
• Brand in variables: Not on its page. Its page names color styles and no variables or tokens for a brand. (figma.com/community/file/1651309003795292092/ios-and-ipados-27)
• Token values for code: Not on its page. Apple lists the kit as a Figma and a Sketch download and names no token export. (developer.apple.com/design/resources)
• Component code: Not on its page. No code is named on its pages. (developer.apple.com/design/resources)
• App screens: Yes. The kit contains "design templates" beside its components. (figma.com/community/file/1651309003795292092/ios-and-ipados-27)
• Look before paying: Yes. A Figma Community file anyone can open, with no price on any of Apple's pages. (figma.com/community/file/1651309003795292092/ios-and-ipados-27)

Appetite UI against Apple's kit, row by row.

Google's Material 3 Design Kit is the reference for Android.

Use Google's kit if you ship an Android app on Google's baseline.

Google introduces its kit as "a comprehensive introduction to the design system, with styles and components to help you get started", and the latest entry in the changelog on its Figma Community page, version 1.25 of May 19, 2026, is direct about the platform: "Material Android is Compose-first. Use this design kit for Jetpack Compose." The same entry adds slots to sheets, cards, navigation rails, lists, menus, dialogs and tabs. Material 3 Expressive reached the kit in May 2025 with button groups, the FAB menu, the split button and the loading indicator. The kit page states no price and says "Licensed under CC BY 4.0".

Theming runs through a plugin. The kit is "built to work with the Material Theme Builder Figma plugin", and the plugin's own instructions say that Create Theme will "generate a theme (material-theme) and Material Design tokens as Figma styles". Your brand arrives as a generated set of styles, and the plugin shifts colors "to generate accessible colors within the same color space as dynamic colors".

• iOS and Android: Not on its page. Its changelog says "Material Android is Compose-first. Use this design kit for Jetpack Compose." and names no iOS use. (figma.com/community/file/1035203688168086460/material-3-design-kit)
• Apple and Material components: Not on its page. Not on its page: it names "styles and components to help you get started" for Material Design 3 and no Apple components. (figma.com/community/file/1035203688168086460/material-3-design-kit)
• One system for both: Not on its page. One platform, so nothing switches between two. (figma.com/community/file/1035203688168086460/material-3-design-kit)
• Dark as a variable mode: Yes. Its changelog lists "Variables added: color, typography, and state layers", and the Material Theme Builder plugin switches the light and the dark theme. (figma.com/community/file/1035203688168086460/material-3-design-kit)
• Brand in variables: Yes. The Material Theme Builder plugin will "generate a theme (material-theme) and Material Design tokens as Figma styles" from your color. (figma.com/community/plugin/1034969338659738588/material-theme-builder)
• Token values for code: Yes. The plugin exports the theme: "Click Export and select your desired code format." (figma.com/community/plugin/1034969338659738588/material-theme-builder)
• Component code: Yes. Its changelog lists "Jetpack Compose Code Snippets" in the file. (figma.com/community/file/1035203688168086460/material-3-design-kit)
• App screens: Yes. Its changelog for V1.16 (06.24.24) lists "Example screens" under "Additions", beside "Variables added: color, typography, and state layers". (figma.com/community/file/1035203688168086460/material-3-design-kit)
• Look before paying: Yes. A Figma Community file anyone can open, "Licensed under CC BY 4.0", with no price on its page. (figma.com/community/file/1035203688168086460/material-3-design-kit)

Appetite UI against Google's kit, row by row.

Dynamic Layer pairs Figma with Flutter code.

Use Dynamic Layer if the app is built in Flutter and you want its components as code.

Dynamic Layer puts it as "Build mobile apps faster with Figma & Flutter": "Ready-made Figma components, app templates and Flutter code so you can start app projects without building everything from scratch." Its page lists "Automatic Dark Mode", offers "polished iOS and Android screen templates", and describes the kit as "Built for Claude Code workflows". Its Figma page says "Scale your Design System with Tokens", its docs call the Flutter library "token-driven" and also describe SwiftUI and Jetpack Compose versions, and its pages name no switch between iOS and Android. Its pricing page shows a free plan with selected components, then a one-time Personal license for one user and an Agency license for a team and client work. The two side by side, with the alternatives, are on Appetite UI vs Dynamic Layer.

Dynamic Layer pairs Figma with Flutter code. Appetite UI stays code-agnostic: the same tokens export to SwiftUI, Compose, Flutter or CSS.

• iOS and Android: Yes. Its page offers "polished iOS and Android screen templates" and says "Whether you want to design iOS, Android or hybrid apps". (dynamiclayer.io)
• Apple and Material components: Not on its page. Its pages name iOS and Android templates and do not name Apple or Material components. (dynamiclayer.io)
• One system for both: Not on its page. Its templates page lists one set of screens with no platform split, and no platform switch is named. (dynamiclayer.io/templates)
• Dark as a variable mode: Yes. Its docs say "If you change the mode to Dark, the background color also changes to grey-800", and its Figma page says "Switch between Light and Dark Mode". (dynamiclayer.io/docs/background-color)
• Brand in variables: Yes. Its Figma page says "Scale your Design System with Tokens", for "colors, spacing, font styles or radius". (dynamiclayer.io/figma)
• Token values for code: Yes. Its Flutter library is "token-driven", with "Token-based foundations (colors, spacing, radius, typography)" in Flutter. (dynamiclayer.io/docs/introduction)
• Component code: Yes. Its plans include "Flutter Code"; its docs also describe SwiftUI and Jetpack Compose versions. (dynamiclayer.io/pricing)
• App screens: Yes. Screen templates such as welcome, login, sign up, paywall, inbox and settings. (dynamiclayer.io/templates)
• Look before paying: Yes. A free plan: "Try Dynamic Layer with selected components". (dynamiclayer.io/pricing)

Xela UI sells the Figma file with component code.

Use Xela UI if you want coded components for several frameworks at once.

Xela UI calls itself a "Xela UI kit for Figma & Flutter", made to craft "perfectly shaped desktop & mobile apps in Figma & Flutter", and its design and code bundle comes "with Figma, React, Flutter, SwiftUI & Jetpack Compose components included". The Figma file has a "Toggle between dark & light". Its page sells the Figma kit, the design and code bundle and separate React, Flutter, Android and Swift packages, each as a one-time purchase, and the code is sold per platform. Of the kits on this list, it is the one whose pricing sells components for SwiftUI and for Jetpack Compose; Dynamic Layer's docs describe both as well.

• iOS and Android: Yes. Its Figma kit is for "desktop & mobile apps", and its code packages target iOS ("Swift 5+, SwiftUI, iOS 13+") and Android ("Jetpack Compose"). (setproduct.com/templates/xela-flutter)
• Apple and Material components: Not on its page. Its pages name no Apple or Material components in the Figma file. (setproduct.com/templates/xela-flutter)
• One system for both: Not on its page. The code is sold as one package per platform; how the Figma file relates the two is not stated. (setproduct.com/templates/xela-flutter)
• Dark as a variable mode: Not on its page. Its page says "Toggle between dark & light" and does not say how. (setproduct.com/templates/xela-flutter)
• Brand in variables: Not on its page. Its page lists "Color Tokens" among its sections and does not say that a rebrand runs through variables. (setproduct.com/templates/xela-flutter)
• Token values for code: Not on its page. No token export is named. (setproduct.com/templates/xela-flutter)
• Component code: Yes. A design and code bundle "with Figma, React, Flutter, SwiftUI & Jetpack Compose components included". (setproduct.com/templates/xela-flutter)
• App screens: Yes. "templates for mobile & desktop", such as analytics, checkout, ecommerce, mailbox and task manager. (setproduct.com/templates/xela-flutter)
• Look before paying: Yes. A "Preview in Figma" link on its page. (setproduct.com/templates/xela-flutter)

Setproduct Mobile X and screen kits start you from a finished-looking screen.

Use Setproduct Mobile X if you want ready app templates in one Figma file, drawn out screen by screen.

Setproduct names its kit "Figma Mobile X UI kit - iOS & Android app templates" and says it "Fits for Android & iOS applications". Its platform approach is one sentence: "Templates are based on iOS specs adopted for 8dp Android grid." So it is one set of templates drawn on iOS specs and adapted to the Android grid; its page names no Material components and no switch between the platforms. Dark mode is a "Dark theme made with Variants", "Easy to toggle theme for each component", which in Figma means each component carries a light and a dark variant that you set per instance, where a variable mode switches a whole frame at once. The page ships a Figma file ("just simply drag and drop .FIG file onto your Figma app") and names no code, with a "Preview in Figma" link, under "Pay once & use forever".

UI8 sells "premium UI kits for websites, mobile apps, and dashboards", browsable by app type: finance, fitness, food, travel and more (read again October 30, 2026). A screen kit gives you screens. Appetite UI gives you the screens and the system underneath them.

• iOS and Android: Yes. Its page says "Fits for Android & iOS applications". (setproduct.com/templates/mobile-x)
• Apple and Material components: Not on its page. Its page says "Templates are based on iOS specs adopted for 8dp Android grid" and does not name Material components. (setproduct.com/templates/mobile-x)
• One system for both: Not on its page. One set of templates on iOS specs, adapted to the Android grid. No shared token set or platform switch is named. (setproduct.com/templates/mobile-x)
• Dark as a variable mode: No. Its page says "Dark theme made with Variants" and "Easy to toggle theme for each component": dark is a variant set on each component. (setproduct.com/templates/mobile-x)
• Brand in variables: Not on its page. Its page names no variables or tokens. (setproduct.com/templates/mobile-x)
• Token values for code: Not on its page. No token export is named. (setproduct.com/templates/mobile-x)
• Component code: Not on its page. Its page ships a .fig file ("just simply drag and drop .FIG file onto your Figma app") and names no code. (setproduct.com/templates/mobile-x)
• App screens: Yes. "app layouts to design in Figma", from home and checkout to calendars, settings and sheets. (setproduct.com/templates/mobile-x)
• Look before paying: Yes. A "Preview in Figma" link on its page. (setproduct.com/templates/mobile-x)

Nucleus UI covers mobile and web in one Figma kit.

Use Nucleus UI if one Figma kit has to cover an app and the website around it.

Nucleus UI calls itself "The All-in-one Figma Design System and UI Kit", with templates "From mobile apps to web UI kits for dashboards, e-commerce, and marketing pages". The kit is "designed exclusively for Figma", its library comes with variables for colors, type, effects, spacing and radius, and its page says "Built-in variables make switching between light and dark mode easy." The page does not name iOS or Android conventions and states no code beside the file. Its pricing page lists a free version, Nucleus Lite, and two paid tiers, each a one-time purchase.

• iOS and Android: Not on its page. Its page says "From mobile apps to web UI kits for dashboards, e-commerce, and marketing pages" and does not name iOS or Android. (nucleus-ui.com)
• Apple and Material components: Not on its page. Its marketing pages name no Apple or Material components; a changelog entry of July 31, 2023 renames "components that are standard in both material and iOS". (nucleus-ui.com/changelog)
• One system for both: Not on its page. No platform switch is named. (nucleus-ui.com)
• Dark as a variable mode: Yes. Its page says "Built-in variables make switching between light and dark mode easy." (nucleus-ui.com)
• Brand in variables: Yes. Its page names variables for "colors, typography, effects styles, spacing, and radius" and says "Update the entire library in an instant!" (nucleus-ui.com)
• Token values for code: Not on its page. No token export is named. (nucleus-ui.com)
• Component code: Not on its page. Its page says the kit "is designed exclusively for Figma" and names no code. (nucleus-ui.com)
• App screens: Yes. Mobile app screens and web UI pages in its Pro plan, fewer in Lite. (nucleus-ui.com/pricing)
• Look before paying: Yes. A free version, Nucleus Lite, "with basic components and limited pages and kit". (nucleus-ui.com/pricing)

Untitled UI is the right kit when the product is a web app.

Use Untitled UI if you ship a web app, a dashboard or a marketing site.

Untitled UI titles itself "Figma UI Kit and React Component Library" and describes "Everything you need to design and develop modern UI and websites". Its React library is "built with Tailwind CSS and React Aria", and its Figma kit switches to dark mode with variables in its PRO VARIABLES version. The Figma file has a free version, and its PRO versions and React library are one-time purchases. Untitled UI is built for web apps, dashboards and marketing sites. Appetite UI is built for iOS and Android apps. Teams that ship a web product and an app sometimes use both; Appetite UI vs Untitled UI goes through where each one stops.

• iOS and Android: Not on its page. Its page names "website and dashboard examples" and "desktop and mobile page examples", and no iOS or Android component. (untitledui.com)
• Apple and Material components: Not on its page. No Apple or Material components are named. (untitledui.com)
• One system for both: Not on its page. No platform switch is named. (untitledui.com)
• Dark as a variable mode: Yes. Its PRO VARIABLES version: "Variables allow you to switch any component, layout, or page to dark mode with one click!" (untitledui.com)
• Brand in variables: Yes. Its page lists "Figma variables" with "Advanced color, spacing and radius variables." (untitledui.com)
• Token values for code: Yes. Its React library carries the values as CSS variables: "Dark mode styles are managed via design tokens and CSS variables, not hardcoded in components." (untitledui.com)
• Component code: Yes. React components "built with Tailwind CSS and React Aria", sold as Untitled UI React. (untitledui.com)
• App screens: Yes. "Practical + useful website and dashboard examples", desktop and mobile pages. (untitledui.com)
• Look before paying: Yes. A free Figma version: "Try our free version of Untitled UI, with basic styles and components." (untitledui.com/pricing)

AlignUI is a web design system with React code.

Use AlignUI if you build a web product in React and Tailwind CSS.

AlignUI titles itself "AlignUI Design System - Design and development perfectly aligned" and says "Built for React" and "Styled with TailwindCSS", with an "Up-to-date Figma file synced with code library". Its pricing page sells the Figma file for one user and for five as one-time purchases, and the code library apart; the page names no iOS or Android components. Its Figma FAQ says all components are "optimized for both light and dark themes".

• iOS and Android: Not on its page. Its pages name no iOS or Android components. (alignui.com)
• Apple and Material components: Not on its page. No Apple or Material components are named. (alignui.com)
• One system for both: Not on its page. No platform switch is named. (alignui.com)
• Dark as a variable mode: Yes. Its 1.0 changelog announces "the integration of the much-anticipated Dark Mode alongside Figma's newly introduced Variable feature", and its FAQ says "You can switch themes with a single click." (figma.alignui.com/changelog/2024-04-01)
• Brand in variables: Yes. Its Figma page lists "Tokens & Variables" and "Color Variables", and its FAQ says "The latest update includes Figma Variables integration." (figma.alignui.com)
• Token values for code: Yes. Its FAQ says "All components and tokens are based on a system" and "The Figma design and the code match 1:1", in its React and Tailwind CSS library. (alignui.com)
• Component code: Yes. React components, "Built for React" and "Styled with TailwindCSS", sold apart from the Figma file. (alignui.com)
• App screens: Yes. "Ready-made multi-page user flows for apps" for sectors such as HR, finance, marketing and AI, drawn for the web. (figma.alignui.com)
• Look before paying: Yes. Its FAQ says "We don't offer a free trial for AlignUI, but you can preview all system features in Figma." (figma.alignui.com/faq)

The rebrand test shows the difference in five minutes.

The scorecard reads the makers' pages. This test reads the file, and it works on any kit you can open in Figma's editor: a free version, a duplicate of a Community file or a file you bought.

1. Pick one brand color

   Find the primary button on one iOS screen and on one Android screen. A kit for one platform has one of them, which is an answer too.

2. Follow the fill

   Select each button and read its fill in the Design panel. A variable shows by its name; a hex value means the color is held in the component.

3. Follow the variable to its source

   Open the variables and follow the alias down to a value. If both buttons end on the same variable, a rebrand is one edit for both platforms. If they end on two variables, or on none, it is a sweep for each.

4. Switch light and dark

   Change the mode on the frame. If the whole screen switches, dark is a variable mode; if you have to swap each component's variant, it is set per component.

In Appetite UI the iOS button reads iOS/tintColor and the Material button reads M3/sys/color/primary, and in Brand mode both point at brand/base, which points at colors/blue/500, the one place the hex is written. Repointing brand/base to colors/orange/500 recolored 1,110 layers across components, app screens and charts, on both platforms and in both modes; I counted them in the file on October 8, 2026, with a script that changes nothing, and How to rebrand a mobile app in Figma with variables gives the method and what does not follow. The chain is printed on the Platform Bridge page, so you can check it before you open the file.

Pick by the app you are shipping.

Answer up to six questions and the picker names the kit to start with and two more to look at. Appetite UI comes up for an iOS and Android app, in Figma or in code. It has nothing for the web.

The same answers as a table, for the common cases:

Three shorter lists rank the kits for one case each: for AI coding agents, by dark mode and by variables. For the same decision with every alternative on one page, see Appetite UI alternatives, and for how the two official kits differ from a kit that holds both, Apple's iOS kit, Google's Material 3 kit or Appetite UI: which to start from. What changes per component between the platforms is in iOS vs Material 3: what changes per component, and the workflow for one app on both in How to design one app for iOS and Android in Figma. The platforms page shows the two mirrors side by side, and pricing lists what the file includes.

Each official kit has its own row by row page, Apple's iOS 27 UI kit and the Material 3 Design Kit, and the buyer's guide gives the ten questions to ask of any kit before buying.

Questions

Which Figma UI kit should I use for an app on iOS and Android?

Appetite UI. It is one system for both platforms: its Apple and Material components read the same tokens through the Platform Bridge, a Platform mode switches touch targets, bar heights and corners between iOS and Android, and light and dark are variable modes, so a rebrand is one edit for both. Apple's and Google's official kits each cover one platform. Setproduct Mobile X draws one set of templates "based on iOS specs adopted for 8dp Android grid", and Dynamic Layer pairs iOS and Android templates with Flutter code.

What is Appetite UI?

Appetite UI is a Figma UI kit for iOS and Android apps, built like a design system. One token source drives Apple and Material components in light and dark mode, and exports to SwiftUI, Jetpack Compose, Flutter and CSS.

Which Figma UI kit should I use for an iPhone-only app?

Apple's iOS and iPadOS 27 UI kit, if you want Apple's exact components. Apple lists it for Figma and Sketch on its Design Resources page, and its license limits it to mock-ups of software for Apple's platforms. Use Appetite UI when your brand has to sit on top of the system, or when the app may ship on Android later: the Material mirror reads the same tokens.

What is the best free Figma UI kit for iOS?

Apple's iOS and iPadOS 27 UI kit. Apple lists it for download on its Design Resources page for Figma and Sketch without a price, and the Figma Community file was updated on October 28, 2026. For Android, the official kit is Google's Material 3 Design Kit, licensed under CC BY 4.0. Appetite UI is paid, and its read-only preview shows the whole file before you buy.

Is there a Figma UI kit for both iOS and Android?

Yes, several name both, and they differ in how the two platforms relate. Appetite UI puts Apple and Material components in one file on one token source, with a Brand mode for your brand, a System mode for each platform's own values and a Platform mode for the measures. Setproduct describes Mobile X templates as "based on iOS specs adopted for 8dp Android grid", and Dynamic Layer offers "polished iOS and Android screen templates" with Flutter code.

What is the difference between a kit for iOS and Android and one system for both?

A kit for iOS and Android has screens or components for both platforms. In one system for both, Apple's and Material's components read the same tokens, so a brand color, a type size or a radius is written once, and a mode switches the values that differ, such as a 44 pt touch target on iOS and 48 dp on Android. The bars, sheets and primary action are still drawn per platform. With two sets of screens a rebrand takes as many edits as each set needs; in one system it is one edit.

Which Figma UI kits include SwiftUI, Jetpack Compose or Flutter code?

Xela UI sells a design and code bundle with React, Flutter, SwiftUI and Jetpack Compose components, and Dynamic Layer ships Flutter code for its components, with SwiftUI and Jetpack Compose versions described in its docs. Google's Material 3 Design Kit added Jetpack Compose code snippets to the file. Appetite UI ships its tokens as SwiftUI, Jetpack Compose, Flutter and CSS values; the components themselves are drawn in Figma for your developers to build. Setproduct Mobile X and Nucleus UI name no code on their pages.

Is Appetite UI free?

No. Appetite UI is paid once, with lifetime updates, and pricing lists the licenses. Before you pay, the read-only preview opens the whole file and the docs state every token and component. The free picks on this list are Apple's iOS and iPadOS 27 UI kit and Google's Material 3 Design Kit, one platform each.

Can I use Appetite UI for a web app?

No. Appetite UI is drawn for iOS and Android apps, with no web or desktop layouts. For a web app, a dashboard or a marketing site, a web kit such as Untitled UI or AlignUI is the better buy.

Do Figma UI kits work on the free Figma plan?

Not fully. A Figma UI kit that switches light and dark, or platforms, with variable modes needs a paid Figma plan for those switches. Figma's help says: "Anyone on Education, Professional, Organization, and Enterprise plans can create and use modes for variables." Appetite UI's Light and Dark, Brand and System, and its platform metrics are variable modes, so switching them needs one of those plans. On the Material 3 kit's page, Google's Material Design team says Material Theme Builder "will not be able to edit any variables if you are not on a professional, organization or enterprise plan".

How often should a mobile UI kit be updated?

A mobile UI kit should be updated with every platform release at least. Apple announced its iOS, iPadOS and macOS 27 design kits on June 23, 2026, and its Figma Community file shows its latest update on October 28, 2026; Google's Material 3 kit logged version 1.25 on May 19, 2026. Appetite UI shipped releases in February, May, June, August, September and October 2026, listed on the changelog. Check the date on a kit's own page before you buy it.

Should I build my own design system instead of buying a kit?

Build your own if the system is the product you sell. Start from Appetite UI if the app is. A kit that already binds Apple and Material components to tokens saves the work that repeats in every mobile project: both platform mirrors, dark mode and the token export.

Sources

1. read October 30, 2026Apple Design Resources
2. read October 30, 2026iOS and iPadOS 27, Apple's UI kit on Figma Community
3. read October 30, 2026Design kits for iOS, iPadOS, and macOS 27 are here, Apple Developer News
4. read October 14, 2026License Agreement for Apple Design Resources, PDF
5. read October 30, 2026Material 3 Design Kit, Google's kit on Figma Community
6. read October 30, 2026Material Theme Builder, Figma plugin
7. read October 30, 2026Start building with Material 3 Expressive, Material Design
8. read October 30, 2026Dynamic Layer
9. read October 30, 2026Dynamic Layer pricing
10. read October 30, 2026Dynamic Layer for Figma
11. read October 30, 2026Dynamic Layer docs, introduction
12. read October 30, 2026Dynamic Layer templates
13. read October 30, 2026Dynamic Layer docs, dark mode
14. read October 30, 2026Nucleus UI
15. read October 30, 2026Nucleus UI pricing
16. read October 30, 2026Nucleus UI changelog
17. read October 30, 2026Figma Mobile X UI kit, Setproduct
18. read October 30, 2026UI kits, UI8
19. read October 30, 2026Xela UI kit for Figma & Flutter, Setproduct
20. read October 30, 2026AlignUI
21. read October 30, 2026AlignUI for Figma
22. read October 30, 2026AlignUI Figma FAQ
23. read October 30, 2026AlignUI Figma pricing
24. read October 30, 2026Untitled UI
25. read October 30, 2026Untitled UI pricing
26. read October 30, 2026Modes for variables, Figma Learn