Duotone Filters

Mesmerizing photos often use duotone filters, blending two contrasting colors for a dynamic, high-contrast effect. This adds instant intrigue and drama. With WordPress, incorporating duotone filters is easy, enhancing visuals and motivating your audience effortlessly.

Block themes such as Powder leverage this capability, making it easy for users to add duotone filters to any image on their website.

Here’s the code used to define duotone filters in theme.json:

{
	"settings": {
		"color": {
			"duotone": [
				{
					"colors": [ "#0a0a0a", "#ffffff" ],
					"name": "Black and White",
					"slug": "black-and-white"
				},
				{
					"colors": [ "#6d28d9", "#ffffff" ],
					"name": "Primary and White",
					"slug": "primary-and-white"
				}
			]
		}
	}
}

WordPress core registers its own set of duotone filters, using highly opinionated colors. The following code disables them in theme.json:

{
	"settings": {
		"color": {
			"defaultDuotone": false,
		}
	}
}