Material 3 Expressive in React Native

Search for Material 3 Expressive in React Native and you find one discussion on the most popular React Native UI library, opened in May 2025, with zero replies. That is the whole state of the ecosystem. The look is on Pixel phones, the components exist in Google’s own toolkit, and nothing in JavaScript land wraps them yet. Here is what exists, and the route that works today.

1. What Expressive is, and where it already runs

Material 3 Expressive is Google’s 2025 refresh of its design system: bigger shapes, springier motion, a floating toolbar, button groups that squish, a loading indicator that morphs through shapes. It shipped on Pixels with Android 16 QPR1 in September 2025, so a current Android phone’s own apps already look like this, and an app with the older flat Material look is dated next to them.

In code it lives in Jetpack Compose’s Material 3 library. As of late September 2026 the stable release is 1.4, with the Expressive components still arriving through the 1.5 alphas behind an experimental opt-in. That is the first honest fact: even native Android developers are on a moving target.

2. What React Native gives you today

• Expo UI. Expo’s @expo/ui exposes Jetpack Compose primitives to React Native and went stable in SDK 56, with Material 3 components and dynamic colour. It is Material 3, not Expressive: no floating toolbar, no shape-morphing indicator, no button groups.
• The popular UI libraries. Written in JavaScript, drawing Material themselves. They follow Google’s spec with a lag of a year or two, and Expressive is not there.
• A webview. Does not count.

So for a React Native app, Expressive today means reaching Compose directly.

3. The route: a small Kotlin module

Expo Modules let you write a native view in Kotlin and use it from React Native like any component. A Compose view inside an Expo module is a few hundred lines, and that is where Expressive lives: the floating toolbar, the button group, the loading indicator, the large flexible top bar, each as a Compose composable exposed with the props you need.

Three things we learned doing exactly this:

• Keep the API small. Expose the five components Expressive is known for, not the whole library. Everything else is plain Material 3 and Expo UI already covers it.
• Seed every colour slot from the accent. A Compose Material component with an unset colour falls back to the default theme, which is the one thing that makes an app look like a template. Generate the whole scheme from the app’s accent (Material’s own colour utilities do this) and pass it in, so no slot is ever default.
• Pin the Compose version. With Expressive in alphas, an unpinned dependency is a build that breaks on someone else’s machine. Pin it, and upgrade on purpose.

4. What not to do

Do not try to make Android look like iOS, and do not try to make the two identical. A tab bar that is glass on iPhone and a floating Material bar on Pixel is one design on two phones, each native. Claiming they look the same is both false and worse: each platform’s users know their own phone’s look, and a copy of the other one reads as foreign.

Where to start

If you are hand-building, start with the floating toolbar: it is the most visible Expressive piece and the simplest composable. Wire it as an Expo module view, seed its colours from your accent, and ship that before the rest.

If you would rather not write Kotlin, the apps your coding agent builds from the App Builder carry the module already: Material 3 Expressive on Android and Liquid Glass on iOS 26 from one design, with the colour seeding and the pinned versions in the code you get.