~/docs/glass

Liquid Glass

On iOS 26, toasts can be drawn in Liquid Glass. It is opt-in: the solid gooey toast stays the default.

Turn it on

npx expo install expo-glass-effect
Copy
import 'sileo-native/glass'; // once, anywhere <Toaster appearance="glass" />; // every toast sileo.success({ title: 'Saved', appearance: 'glass' }); // or one
Copy
The import registers expo-glass-effect with sileo-native. The core never imports it, so apps without it bundle fine.

How it morphs

The pill and the card are two glass views in one GlassContainer, which melts glass shapes together where they meet. The card starts as the pill’s footprint and spreads to full width as it grows, the way the gooey filter does.

Tint

The built-in themes tint the glass lightly, white in a light app and dark in a dark one, so text stays readable over busy content. Change it through the theme, or set it to transparent:
<Toaster appearance="glass" theme={{ glass: { tint: 'transparent' } }} />
Copy

Fallbacks

Android, iOS before 26, and the web draw the solid toast.
So does iOS with Reduce Transparency on.
Without the import, glass falls back to solid and warns once in development.
The toast from sileo, ported to React Native. Built in the open by rayanstudio.
© 2026 rayan · MIT License
A native port of sileo by hiaaryan