# Liquid glass light spill: parameters

Source: https://meniscus.site/effects/light-spill · Updated 2026-10-02

**Looks like:** Light from colourful content beside large glass tints its inner glow and its shadow on that side, and the shadow grows where the glass sits over busy text and shrinks over calm colour, so large glass belongs to what is around it.

Also called: spill, colour spill, color spill, adaptive shadow, content light.

**Use in:** Large glass beside colourful content: sidebars and inspectors next to artwork or photos, a mini player over album art, a toolbar above a bright hero.

**Avoid:** Small controls (the effect is invisible and muddies them); strong colour casts that look like a tint material; colour that changes with every scroll frame (update it when the content changes).

**Parameters:** the content's average colour at 6–12 % in the inner glow on the side facing it and in the shadow; shadow opacity +30–50 % over high-frequency backdrops (text, fine lines), −20 % over calm colour.

**Design tool:** Add an inner shadow on the content side in the content's colour at 8–10 % and tint the drop shadow the same; raise the drop shadow where the glass covers text.

**Web:** Set --spill to the content's colour; the glow layer adds an inset shadow in color-mix(in srgb, var(--spill) 10%, transparent) on that side and the shadow takes the same tint (web recipe section G).

**Shader:** `glow.rgb = mix(white, spillColour, 0.1) on the facing side; shadow alpha × (1 + 0.4 × backdropContrast).`

## Reference renders

The tool attaches these images; each shows:

- Light spill: a frosted glass now-playing panel beside a vivid pink-to-blue artwork tile over pastel ribbons, its glow on the side facing the art. (light)
- Light spill: a frosted glass now-playing panel beside a vivid pink-to-blue artwork tile over dark ribbons, its glow on the side facing the art. (dark)

## Use it with your assistant

This spec is what the Meniscus MCP server's `get_spec` tool returns for `light-spill`. Materials, colours, light and composition rules that apply to every effect 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