Build amazing sites with this great collection of componentsBuy Now

Duotones

Sparkling and popular

Spotify has played a major role in popularizing the duotone effect. Using a pair of colors over a photo add drama and impact to photos. The extraordinary color scheme makes dull pictures fun and vibrant.

Only a few years ago you needed to be a Photshop Master to create them. Now, thanks to CSS Filters & Blend modes you can create them right in the browser (and Site Designer).


Duotone

The effect is created by placing a picture in a container with a specific background color. A filter is used on the picture. For some effects and filter is used on an overlay (container) that is snapped on top of a picture. 

To the change the color scheme, go to the Elements Pane. Select the Container with the duotone-background class. You can change the colors on the Design Pane by swapping out the color classes ( .yellow and .accent-4 ) or change any styles using the design controls.

Placeholder Picture
No effect
Placeholder Picture

More effects coming soon!

Placeholder Picture

There is some copyright thingy going here too. Feel free to do whatever you want with it after purchase [except resell without significant modification].