DevExtreme Vue - Color the Shading of the Background

When the Popup is shown, the area beneath it can be shaded. To enable this behavior, assign true to the shading option. The shading color is specified by the shadingColor option.

HTML
JavaScript
<div id="popupContainer">
    <p>Popup content</p>
</div>
$(function() {
    $("#popupContainer").dxPopup({
        title: "Popup Title",
        visible: true,
        shading: true,
        shadingColor: "rgba(0, 0, 0, 0.2)"
    });
});

Note that the default shading color is transparent.

See Also