When to use
Use the transparency stops when a mockup needs to show how Liquid Glass looks for people who changed the setting. Ultra clear shows the most of what is behind the glass, and fully tinted is the most solid.
Props
| Prop | Values | Default | Description |
|---|---|---|---|
class | "ios-glass" | "ios-glass-clear" | "ios-glass-prominent" | – | Regular glass, clear glass for photos, or tinted glass for the main action. |
data-transparency | "ultra-clear" | "clear" | "default" | "tinted" | "fully-tinted" | default | Pins one glass element to a stop on the Liquid Glass slider. |
--ios-glass-transparency | 0 to 1 | 0.5 | Set on a screen or any ancestor to move all glass under it. 1 is clear, 0 is tinted. |