Effect

Liquid glass tint

Glass carrying colour: accent or danger tint laid over the refraction while the backdrop still shows through and bends.

Also called colour glass, color glass, vibrancy, tinted, prominent, colored glass

A blue-tinted glass capsule over dunes and sky.
A blue-tinted glass capsule over dunes and sky. (light)

Where to use it

Use in
Prominent buttons (glass prominent), selected states, accent/danger variants, tooltips; adaptive tint picked up from the backdrop.
Avoid
Opaque colour fills that hide the backdrop; heavy global tint on all glass; muddy desaturation.

Parameters

accent tint 25–40 % (#2B6BFF), danger 25–35 % (#E5484D); vibrancy (saturation) ×1.3–1.6 on the backdrop.

How it is built

Design tool
Fill the glass shape with the accent at 25–40 % above the refraction layers; keep the rim.
Web
Set the optic layer fill to rgba(accent, .3); feColorMatrix saturate 1.4 in the filter.
Shader, in one line
col = mix(col, tintColor, tintAmount); saturate with mix(col, luma, -0.4).