# Liquid glass dialog: spec and references

Source: https://meniscus.site/components/dialog · Updated 2026-09-27

Blocking decision or form. Layer: overlay (modal).

Also called: alert dialog, modal, alert, confirm.

| Property | Value |
|---|---|
| Material | frost |
| Profile | squircle |
| Geometry | radius 24–28, width 320–420, padding 20–24; actions right-aligned capsules |
| Bezel (px) | 26–28 |
| Displacement (px) | 60–75 |
| Blur (px) | 10–18 |

## Anatomy

- dim + blur the world (black 25 % light / 45 % dark, 2–6 px blur)
- frosted panel
- title 15–17 semibold, body secondary
- inputs as flat troughs (darker fill, no optics of their own)
- actions: glass Cancel + solid accent (or solid red for destructive)
- corner close glyph stays flat

## States

- open: scale 0.94 → 1 + fade
- closing

## Rules

- The rim must stay readable against the dim.
- Destructive primary is solid red; only one solid button.

## References

![A frosted confirmation dialog over a dimmed, blurred dune scene, with a filled confirm field, a glass Cancel and a solid red Delete.](https://meniscus.site/gallery/dialog-light-studio.webp)

![A frosted confirmation dialog over a dimmed, blurred night-city scene, with a filled confirm field, a glass Cancel and a solid red Delete.](https://meniscus.site/gallery/dialog-dark-studio.webp)

## Use it with your assistant

This spec is what the Meniscus MCP server's `get_component_spec` tool returns for `dialog`. Materials, colours, light and composition rules that apply to every component are in the [liquid glass guide](https://meniscus.site/liquid-glass). Connect: `claude mcp add --transport http meniscus https://meniscus.site/mcp` — setup for every client: https://meniscus.site/docs