---
title: The best Figma UI kits for mobile apps in 2026
description: Apple's kit for iOS only, Google's Material 3 kit for Android only, one token source for both. Eight Figma UI kits for mobile apps, sorted by the app you ship.
author: Bob Poláček
topic: Comparison
published: 2026-09-24
updated: 2026-09-26
source: https://www.appetiteui.com/blog/best-figma-ui-kits-for-mobile-apps
---

# The best Figma UI kits for mobile apps in 2026

Apple's kit for iOS only, Google's Material 3 kit for Android only, one token source for both. Eight Figma UI kits for mobile apps, sorted by the app you ship.

By Bob Poláček, updated September 26, 2026.

The best Figma UI kit for a mobile app depends on where the app ships. For an app that runs only on iPhone and iPad, start from Apple's iOS and iPadOS 27 UI kit; for an app that runs only on Android, start from Google's Material 3 Design Kit. Both are free and official, and each covers one platform. For one app on iOS and Android, pick a kit that keeps both platforms on one token source. 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.

**In short**

- iOS only: Apple's iOS and iPadOS 27 UI kit, updated on September 15, 2026. Android only: Google's Material 3 Design Kit, which Google says to use for Jetpack Compose.
- One app on iOS and Android: a kit that holds both platforms on one token source, such as Appetite UI, so the brand color is set once for both.
- Component code beside the Figma file: Xela UI sells React, Flutter, SwiftUI and Jetpack Compose components, and Dynamic Layer ships Flutter code.
- Finished screens to start from: Setproduct Mobile X, Nucleus UI and the app kits on UI8. For a web product: Untitled UI.
- Before you buy any kit, open its variables panel and follow one color: held once, a rebrand is one edit; held per component, it is a sweep through every screen.

I design Appetite UI, so one entry on this list is mine; read it knowing that. Every other kit is described in its maker's own words, quoted from its own page on September 24, 2026, and linked under Sources. There are no counts, ratings or prices of anybody else's product here, only whether a file is free, because prices change and are the maker's to state.

## 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 if it has one, before you pick it.

**What to check in a mobile UI kit before you buy it**

| Check | What to look for |
| --- | --- |
| Platforms | iOS, Android or both, named on the kit's own page. The two disagree on bars, sheets, the primary action and touch targets. |
| Light and dark | Variable modes, component variants or duplicated frames. The phone's system setting switches the appearance, so every screen needs both. |
| A rebrand | Open the variables panel and follow one color. Held once, it moves every screen; held per component, it is a sweep. |
| Beside the file | Component code, token values or nothing. A developer who receives values does not retype them. |
| License | The license linked from the file. Apple's names the platforms it covers; section 2A is quoted below. |
| Updates | The date on the file page, or a changelog. Apple overhauled its kit for iOS 27; Material 3 Expressive updated app bars, buttons and navigation bars. |

For what a variable mode does that a duplicated frame cannot, see [Dark mode with Figma variables, not duplicate frames](https://www.appetiteui.com/blog/dark-mode-figma-variables).

## The shortlist fits in one table.

**Figma UI kits for mobile apps, each in its maker's words**

| Kit | Built for, in its maker's words | Beside the Figma file |
| --- | --- | --- |
| [Apple's iOS 27 kit](https://www.figma.com/community/file/1651309003795292092/ios-and-ipados-27) | "iPhone and iPad design comps and user flows" | A Sketch version; SF Symbols separately |
| [Google's Material 3 kit](https://www.figma.com/community/file/1035203688168086460/material-3-design-kit) | "Use this design kit for Jetpack Compose" | Compose code snippets, per its changelog |
| [Appetite UI](https://www.appetiteui.com/) | iOS and Android apps, both in one file | Token values for SwiftUI, Compose, Flutter and CSS |
| [Xela UI](https://www.setproduct.com/templates/xela-flutter) | "desktop & mobile apps in Figma & Flutter" | React, Flutter, SwiftUI and Compose components, as a bundle |
| [Dynamic Layer](https://www.dynamiclayer.io/) | "iOS, Android or hybrid apps" | "Flutter code for the components" |
| [Setproduct Mobile X](https://www.setproduct.com/templates/mobile-x) | "Android & iOS applications" | Not stated on its site |
| [Nucleus UI](https://www.nucleus-ui.com/) | "From mobile apps to web UI kits" | Not stated on its site |
| [Untitled UI](https://www.untitledui.com/) | "modern UI and web design" | React components, as Untitled UI React |

Checked on September 24, 2026 against each product's own public pages.

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

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 September 15, 2026. It is free on Apple's Design Resources page, for Figma and for Sketch.

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](https://developer.apple.com/support/downloads/terms/apple-design-resources/Apple-Design-Resources-License-20230621-English.pdf), LYL142, 06/21/2023, read September 24, 2026.

**Pick it when** you ship on iOS only and want Apple's exact components.

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

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.

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.

**Pick it when** you ship an Android app on Google's baseline.

## 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 puts Apple and Material components in one Figma file and binds both to the [same tokens](https://www.appetiteui.com/tokens). The [Platform Bridge](https://www.appetiteui.com/docs/platform-bridge) holds 112 variables: 52 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 544 variables in 6 collections.

![One Appetite UI account setup screen four times, the iOS mirror and the Material 3 mirror, each with its Platform Bridge set to Brand and to System: the Material screen turns purple in System mode](https://www.appetiteui.com/images/blog/best-figma-ui-kits-for-mobile-apps--01.webp)

*Brand mode points every platform slot at your tokens. System mode returns Apple's and Google's published values.*

The token source is one file in the W3C Design Tokens format, and its SwiftUI, Jetpack Compose, Flutter and CSS outputs come in the file you buy ([code output](https://www.appetiteui.com/docs/code-output)). Those outputs are values, not component code: colors, spacing, type and motion, ready for the components your developers build; [How one Figma token becomes SwiftUI, Compose, Flutter and CSS](https://www.appetiteui.com/blog/figma-token-to-swiftui-compose-flutter-css) follows one token through all four. The [app screens](https://www.appetiteui.com/screens) for finance, booking, fitness, social and AI apps are assembled from the same components in light and dark, and the [Core Skill](https://www.appetiteui.com/ai), included with the file, tells an AI agent which token to reach for.

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. You can check all of it before paying: the full file has a [read-only preview](https://www.figma.com/design/iNFK9Pl2e9vEeClqhm1F4t/Appetite-UI-%E2%9C%A6-2.4?node-id=10-602), and the [docs](https://www.appetiteui.com/docs/introduction) state every token and component.

**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.

## Xela UI and Dynamic Layer sell the Figma file with component code.

If your developer wants the components themselves as code, two kits sell them beside the Figma file. 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 itself is described as a "Customizable & adjustable dashboard design system" with a "Toggle between dark & light". Of the kits on this list, it is the one that sells components for SwiftUI and for Jetpack Compose.

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", describes the kit as "Built for Claude Code workflows", and has a free preview "with selected components". More in [Alternatives to Dynamic Layer for Figma mobile design](https://www.appetiteui.com/blog/alternatives-to-dynamic-layer), and the two side by side on [Appetite UI vs Dynamic Layer](https://www.appetiteui.com/compare/dynamic-layer).

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

**Pick Xela UI when** you want coded components for several frameworks at once. **Pick Dynamic Layer when** the app is built in Flutter and you want its components as code.

## Screen kits start you from a finished-looking 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." 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.

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

**Pick one when** you need a specific app type on screen quickly, drawn out screen by screen.

## Nucleus UI covers mobile and web in one kit.

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". Its library comes preconfigured with "colors, typography, effects styles, spacing, and radius variables", and its page says "Built-in variables make switching between light and dark mode easy." What ships beside the file is not stated beyond a "Developer-friendly" heading that says the kit is "Built with production in mind", and the page does not name iOS or Android conventions.

**Pick it when** one kit has to cover an app and the website around it.

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

Untitled UI titles itself "Figma UI Kit and React Component Library" and describes "Everything you need for modern UI and web design". Its React library is "built with Tailwind CSS and React Aria", and its Figma kit switches to dark mode with "color variables" in its PRO VARIABLES version. 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; the [short comparison](https://www.appetiteui.com/compare/untitled-ui) and [Appetite UI vs Untitled UI for a mobile app, screen by screen](https://www.appetiteui.com/blog/appetite-ui-vs-untitled-ui) go through where each one stops.

**Pick it when** you ship a web app, a dashboard or a marketing site.

## Pick by the app you are shipping.

**Which kit to start with, by the app you ship**

| Your app | Start with | Why |
| --- | --- | --- |
| iOS only, Apple's exact look | Apple's iOS and iPadOS 27 UI kit | Apple's own components, updated with the platform |
| Android only, on Google's baseline | Google's Material 3 Design Kit | Made for Jetpack Compose, themed with Material Theme Builder |
| One app on iOS and Android, one brand | Appetite UI | Both platforms on one token source, with a switch back to each baseline |
| iOS today, Android on the roadmap | Appetite UI | The Material mirror reads the same tokens when Android arrives |
| Flutter, with components as code | Dynamic Layer or Xela UI | Both sell Flutter code for their components |
| SwiftUI or Compose components as code | Xela UI | Sells SwiftUI and Jetpack Compose components |
| Screens of one app type to start from | Setproduct Mobile X or an app kit on UI8 | Finished screens of that app type |
| A web app, dashboard or marketing site | Untitled UI | Built for the web, with React components |

![A decision tree that starts at Where does the app ship: iOS only leads to Apple's iOS kit, Android only to Google's Material 3 kit, both to one token source for both platforms and web to a web kit, and after both a second question, components as code too, leads to a kit that also ships code](https://www.appetiteui.com/images/blog/best-figma-ui-kits-for-mobile-apps--02.webp)

For the same decision with every alternative on one page, see [Appetite UI alternatives](https://www.appetiteui.com/compare/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](https://www.appetiteui.com/blog/apple-ios-kit-vs-material-3-kit). What changes per component between the platforms is in [iOS vs Material 3: what changes per component](https://www.appetiteui.com/blog/ios-vs-material-3-components), and the workflow for one app on both in [How to design one app for iOS and Android in Figma](https://www.appetiteui.com/blog/design-one-app-for-ios-and-android-in-figma). The [platforms page](https://www.appetiteui.com/platforms) shows the two mirrors side by side, and [pricing](https://www.appetiteui.com/pricing) lists what the file includes.

## Questions

### What is the best free Figma UI kit for iOS?

Apple's iOS and iPadOS 27 UI kit. Apple publishes it free on its Design Resources page for Figma and Sketch, and the Figma Community file was updated on September 15, 2026. For Android, the free official kit is Google's Material 3 Design Kit. Appetite UI is paid, and its [read-only preview](https://www.figma.com/design/iNFK9Pl2e9vEeClqhm1F4t/Appetite-UI-%E2%9C%A6-2.4?node-id=10-602) shows the whole file before you buy.

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

Yes. Appetite UI puts Apple and Material components in one file on one token source, with a Brand mode for your brand and a System mode for each platform's own values. 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.

### 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. 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.

### 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 updated the iOS file on September 15, 2026; Google's Material 3 kit logged version 1.25 on May 19, 2026. Appetite UI shipped releases in February, May, June, August and September 2026, listed on the [changelog](https://www.appetiteui.com/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. [Apple Design Resources](https://developer.apple.com/design/resources/), read September 24, 2026
2. [iOS and iPadOS 27, Apple's UI kit on Figma Community](https://www.figma.com/community/file/1651309003795292092/ios-and-ipados-27), read September 24, 2026
3. [Design kits for iOS, iPadOS, and macOS 27 are here, Apple Developer News](https://developer.apple.com/news/?id=e2lxw9l1), read September 24, 2026
4. [License Agreement for Apple Design Resources, PDF](https://developer.apple.com/support/downloads/terms/apple-design-resources/Apple-Design-Resources-License-20230621-English.pdf), read September 24, 2026
5. [Material 3 Design Kit, Google's kit on Figma Community](https://www.figma.com/community/file/1035203688168086460/material-3-design-kit), read September 24, 2026
6. [Material Theme Builder, Figma plugin](https://www.figma.com/community/plugin/1034969338659738588/material-theme-builder), read September 24, 2026
7. [Start building with Material 3 Expressive, Material Design](https://m3.material.io/blog/building-with-m3-expressive), read September 24, 2026
8. [Xela UI kit for Figma & Flutter, Setproduct](https://www.setproduct.com/templates/xela-flutter), read September 24, 2026
9. [Dynamic Layer](https://www.dynamiclayer.io/), read September 24, 2026
10. [Figma Mobile X UI kit, Setproduct](https://www.setproduct.com/templates/mobile-x), read September 24, 2026
11. [Nucleus UI](https://www.nucleus-ui.com/), read September 24, 2026
12. [UI kits, UI8](https://ui8.net/categories/ui-kits), read September 24, 2026
13. [Untitled UI](https://www.untitledui.com/), read September 24, 2026
14. [Modes for variables, Figma Learn](https://help.figma.com/hc/en-us/articles/15343816063383-Modes-for-variables), read September 24, 2026