Published on March 26, 2019

Tutorial: Color Dodge Blend Mode Effect in Oxygen

In this tutorial, you’ll learn how to create a color dodge blend mode effect using the new CSS Blend Modes feature in Oxygen 2.2.

With the blend modes feature of CSS, effects that previously required Photoshop or other image editing software can now be handled entirely by the browser.

You can apply blend modes to any element from Advanced > Effects > Opacity. Blend modes can also be applied to background layers from Advanced > Background > Background Blend Mode.

In this tutorial, we’ll use a section with a parallax background image, and place a heading in the section, and set the heading’s blend mode to color dodge for a semi-transparent overlay effect.

The Oxygen Team
Updated on: January 30, 2025

You'll build incredible websites with Oxygen

Get started with Oxygen today and unlock incredible value.

Get Oxygen

30-day money back gurantee

Try Oxygen risk-free. If youโ€™re not satisfied, get a full refund within 30 days.

Unlimited site license

Use Oxygen on as many personal or client projects as you want โ€” no limits.

Fast, world-class support

Our experienced team is eager to assist you with technical questions.

Use on client websites

Build and deliver professional-grade websites for your clients with no extra fees.