Settings›Adaptation

Adaptation

Adapt tint, foreground contrast and frost to the scene beneath a surface.

Try the modes

Upload a photo through the example control. It stays local and is reused by other examples. Analysis uses the supplied backdrop, not arbitrary pixels from the page.

Choose what adapts

Scene defaults and local overrides

import { setSceneMaterial, getSceneMaterial } from "@edinstvo/glass";
setSceneMaterial({ adaptation: "full", adaptationStrength: 1 });
console.log(getSceneMaterial());
setSceneMaterial(null); // Clear scene material defaults.

Scene material defaults are combined with scene lighting, CSS tokens and local material layers. Each property inherits independently. A local value wins; inherit keeps its parent and default restores the engine default.

<edinstvo-glass adaptation="contrast">Automatic text</edinstvo-glass>
<edinstvo-glass adaptation="off" tint="#fff">Manual material</edinstvo-glass>

Manual control

adaptationStrength ranges from 0 to 1, default 1. Zero skips analysis. Explicit tint and foreground colors are retained. Automatic foreground is black or white; web components apply it to content. With attachGlass, apply color: var(--glass-foreground, inherit) to text.

Input CSS tokens are --glass-adaptation, --glass-adaptation-strength and --glass-text-color. Adaptation changes effective rendering values, leaving the configured material intact.

Smooth changes

adaptationDuration ranges from 0 to 1000 ms, default 300. Tint, foreground, transparency and frost interpolate between targets, including the return to a manual material. Set adaptation-duration="0" for instant updates. Reduced-motion preferences skip interpolation. Rendering stops once the transition settles.

Under ordinary accessibility settings, full changes configured transparency and frost by at most 0.18 to preserve the glass appearance. Use contrast when the sampled contrast target matters more than transparency. Increased contrast or reduced-transparency preferences can override the visual limit in full. data-glass-adapting marks a transition; the contrast estimate describes its target, not every intermediate frame.

Accessibility and sampling limits

A 12×12 local crop is sampled at most once per 150 ms per surface. Contrast modes target 4.5:1 for sampled colors, or 7:1 with increased system contrast. Reduced transparency lowers the transparency limit; forced colors hide the optical canvas and use system colors.

This estimate precedes final optics and text rendering. It does not guarantee WCAG compliance. Manual colors, partial strength, small details and moving content can prevent the target. data-glass-contrast exposes the estimate. Audit the final interface separately.