Challenge

  • Text is hard to read when contrast is too low on bright or busy images.
  • Solid overlays may improve contrast but weaken image impact.
  • Important image areas may get covered too early by text.

➔ Solution: Dynamic Shadow 

This feature automatically adjusts contrast only when needed, ensuring readability while keeping images bright and vibrant. Additionally, the Invert option allows you to lighten dark backgrounds instead of darkening bright ones, offering even more design flexibility.

Why this feature is important

✔ Ensures readability at all times
The background darkens dynamically as text scrolls over it, improving contrast without permanently dimming the image.

✔ Maintains design integrity
The effect activates only when necessary, preserving the natural brightness and color of images.

✔ Enhances user experience
By subtly increasing contrast where needed, text remains clear without disrupting the overall storytelling flow.

How to apply the feature

1️⃣ Select a section
Choose a section with an image or video background in the editor.

2️⃣ Define a motif area (required for dynamic shadows)
Click on the three-dot menu of the background medium and "Select motif area" 

3️⃣ Activate dynamic shadow
Scroll down to Text Background settings and adjust the slider to control intensity.

Combine with the following features

✐ Optimize motif placement
Ensure the motif area aligns correctly in both desktop and mobile views for optimal readability.

✐ Test in phone preview
Switch to mobile preview to check the motif area and readability on smartphones.

✐ Add separate mobile media
Upload alternative portrait media for a perfect display - also on mobile devices.