In this documentation, we will discuss the customization of the Backdrop Filter/Liquid Glass Effects Extension, brought to you by the Element Pack Pro.

Why the Backdrop Filter/Liquid Glass Effects Extension?

The Backdrop Filter / Liquid Glass Effect is used to create a modern, elegant, and visually appealing design by applying effects (like blur, brightness, contrast, or transparency) to the background of an element rather than the element itself.

Enabling The Backdrop Filter/Liquid Glass Effects Extension

To use the Backdrop Filter/Liquid Glass Effects Extension from Element Pack, you must first enable the extension.

1. Go to WordPress Dashboard > Element Pack Plugin dashboard.
2. Then Click the Extension Tab.
3. Search the Backdrop Filter/Liquid Glass Effects Extension Name.
4. Enable the Backdrop Filter/Liquid Glass Effects Extension.
5. Hit the Save Settings Button.

How and Where You Find the Extension inside Editor

You can apply the Backdrop Filter / Liquid Glass Effect to any section/container, column, or widget.
After selecting your section, container, column, or widget, you will find the extension inside the Background option.

For demonstration, we’ve designed a section as shown in the screenshot below. You can use this feature anywhere you need.

Let’s Start to Customize the Extension

To demonstration the extension feature, just follow the below instructions-

1. Select the section/container where you set the background image.
2. Go to the style tab.
3. Background section > set the section/container background image.

After seting the Background image, just follow the below steps-

1. Select the previous design column where you want to use the extension feature.
2. Go to the Style Tab.
3. Background > Backdrop Filter/Liquid Glass Effects section.

When Selecting the Effect Type- Backdrop Filter

After clicking on the Backdrop Filter/Liquid Glass Effects option, a dropdown will appear with two choices: Backdrop Filter and Liquid Glass Effects. Let’s start with the Backdrop Filter option.

When you select the Backdrop Filter option then you will get the below option to customize it –

• Blur – Adjusts the blurriness of the background.
• Brightness – Controls how light or dark the background appears.
• Contrast – Increases or decreases the difference between light and dark areas.
• Grayscale – Converts the background into black-and-white tones.
• Invert – Inverts the background colors into their opposites.
• Opacity – Sets the transparency level of the background.
• Sepia – Applies a warm, brownish tint for a vintage effect.
• Saturate – Adjusts the intensity of background colors.
• Hue Rotate – Rotates the overall color hues of the background.

When selecting the Effect Type- Liquid Glass Effects

Blur: Adjusts the blurriness of the background.

Note: Liquid glass effect works best with transparent or semi-transparent backgrounds. For optimal results, ensure the parent section has a background image or color.

All done! You have successfully customized the Backdrop Filter/Liquid Glass Effects Extension on your website.

Video Assist

I hope the video will help you to learn more about the feature. Please check the demo page for more examples.

Thanks for staying with us.