Backdrop blur

The Telerik and Kendo UI Filter Utilities enable you to apply different CSS filters to an element.

Backdrop Blur

Telerik and Kendo UI Backdrop Blur Utilities are CSS classes that enable you to control the bounding box of the element's background.

Utility ClassCSS Property
.k-backdrop-blur-lgbackdrop-filter: blur(12px);
.k-backdrop-blurbackdrop-filter: blur(8px);
.k-backdrop-blur-nonebackdrop-filter: blur(0);
.k-backdrop-blur-smbackdrop-filter: blur(4px);
.k-backdrop-blur-mdbackdrop-filter: blur(6px);

Applying a Backdrop Blur

Use the k-backdrop-blur, k-backdrop-blur-sm, k-backdrop-blur-md, k-backdrop-blur-lg to apply different levels of backdrop blur to the element.

Removing the Backdrop Blur

Use the k-backdrop-blur-none to remove all backdrop blur filters from an element.

Feedback