Glassy UI
Menu

Liquid Glass, in your app.

The same components for React Native and Expo. iOS 26 draws them with the system’s own Liquid Glass; Android and the web blur. Install with shadcn. Own the code.

Set up in ExpoBrowse components
npx shadcn@4.14.1 add @glassyui-native/glass-button
A Today screen built from Glassy UI components on iOS 27: Liquid Glass cards, a segmented control, a switch, checkboxes and a dock over red ribbon artwork.
iOSThe system’s own Liquid Glass
The same Today screen on Android, its glass blurring the ribbon artwork behind it.
AndroidA blur of the screen behind
The same Today screen in a phone-sized browser window, its glass blurred with CSS.
WebCSS blur through React Native for Web

React and React Native.

One set of names and props from two registries. Every component page switches between them.

React

For Next.js, Vite and other web apps with Tailwind CSS 4. The glass is drawn with CSS, SVG and WebGL.

Install for React

pnpm dlx shadcn@4.14.1 add @glassyui/glass-button
React

<GlassButton variant="prominent" onClick={save}>
  Save
</GlassButton>

React Native

For Expo apps on iOS, Android and the web. iOS 26 draws the glass itself; elsewhere it blurs.

Install for React Native

npx shadcn@4.14.1 add @glassyui-native/glass-button
React Native

<GlassButton variant="prominent" onPress={save}>
  Save
</GlassButton>

Three steps to glass.

The shadcn CLI copies each component into your app, so every file is yours.

Read the Expo guide

  1. Add the registry

    Expo apps write their own components.json.

    components.json

    {
  "$schema": "https://ui.shadcn.com/schema.json",
  "style": "new-york",
  "rsc": false,
  "tsx": true,
  "tailwind": { "config": "", "css": "", "baseColor": "neutral", "cssVariables": true },
  "aliases": { "components": "@/components", "utils": "@/lib/utils" },
  "registries": {
    "@glassyui-native": "https://glassyui.com/r/native/{name}.json"
  }
}

  2. Add a component

    Its packages come with it.

    Install Glass Button

    npx shadcn@4.14.1 add @glassyui-native/glass-button

  3. Match your SDK

    Line the packages up with your Expo version.

    Match your Expo SDK

    npx expo install --fix

26 components, ready for apps.

Open one to see its React Native code. Scene, lens and the other web patterns stay on the web.

Start with one component.

Free and open source, on the web and in apps.

Set up in ExpoStar on GitHub