Skip to main content

Function: grain()

grain(options?: object): (target: HTMLElement | ReactiveElementBase | Background | DOMElement) => object

Decorates an element or background with a film grain texture.

Parameters​

ParameterTypeDescription
options{ animated?: boolean; granularity?: number; opacity?: number; size?: number; }-
options.animated?booleanWhether the grain subtly flickers/moves (default: true).
options.granularity?numberGranularity scale factor in pixels (default: 1). Higher values produce larger grain blocks.
options.opacity?numberFilm grain opacity from 0 to 1 (default: 0.12).
options.size?numberNoise tile size in pixels (default: 512).

Returns​

(target: HTMLElement | ReactiveElementBase | Background | DOMElement) => object