Video overlay settings

The overlay settings for video are essential for enhancing the visual presentation of video content across your theme. These settings allow you to apply overlays, ensuring a consistent and appealing look that aligns with your brand's aesthetic. They are applied globally but can be customized at the section or block level if needed.

The overlay settings - video include options for applying a solid color or gradient overlay, as well as controlling the transparency level with the overlay opacity setting. This flexibility allows you to maintain a cohesive and visually appealing design across your theme.

For practical usage, you might consider using the overlay color to apply your brand's primary color over all video content, ensuring alignment with your overall brand aesthetic. If you have text overlaid on your videos, using a gradient overlay with higher opacity can ensure text legibility. Additionally, applying a subtle gradient overlay can add visual interest to your videos without distracting from the content.

Overview #

The overlay settings for video are part of the core theme settings, designed to enhance the visual presentation of video content across your theme. These settings allow you to apply overlays to videos, ensuring a consistent and appealing look that aligns with your brand's aesthetic. They are applied globally but can be customized at the section or block level if needed.

Key components and functionality #

Overlay settings - video

This setting group enables you to apply an overlay color or gradient to videos, enhancing their visual appeal and ensuring that any text or elements overlaid on the video remain visible. Note that the overlay will not be displayed if the "Show video player controls" setting is active.

Overlay color

Choose a solid color to overlay on your video. This setting helps maintain a consistent theme across your site and can be adjusted to match your brand's color palette.

Overlay gradient

Apply a gradient overlay to your video to add depth and visual interest. Gradients can make your video content more engaging for viewers.

Overlay opacity

Control the transparency level of the overlay applied to the video. You can adjust the opacity from 0% (completely transparent) to 100% (completely opaque) in increments of 4%. The default opacity is 48%. Adjusting the opacity allows you to balance the visibility of the video content with the overlay effect.

Usage examples #

  1. Brand consistency: You might consider using the overlay color setting to apply your brand's primary color over all video content. This ensures that your videos align with your overall brand aesthetic.

  2. Highlighting text: If you have text overlaid on your videos, you might consider using a gradient overlay with a higher opacity to ensure the text remains legible against the video background.

  3. Visual interest: You might consider applying a subtle gradient overlay to add visual interest to your videos without distracting from the content. Adjust the opacity to achieve the desired effect.

These settings provide flexibility in customizing the appearance of video content across your theme, allowing you to maintain a cohesive and visually appealing design.