Phil Kurth
/ Tips /

How to customize the colour palette for WordPress' Gutenberg block editor

Last updated • 14 October 2019

Building on yesterday’s tip, I’m putting this up to show how easy it is to register a custom colour palette for WordPress’ block editor; AKA Gutenberg.

It’s actually something we can register as a theme feature so it’s all doable on the PHP side and is very straight-forward. Here’s the code you need;

<?php

add_action( 'after_setup_theme', function () {

	add_theme_support( 'editor-color-palette', [
		[
			'name' => 'Purple',
			'slug' => 'purple',
			'color' => '#2B265C'
		],
		[
			'name' => 'Mauve',
			'slug' => 'mauve',
			'color' => '#915099'
		],
		[
			'name' => 'Charcoal',
			'slug' => 'charcoal',
			'color' => '#222222'
		],
	] );

} );

Need a website?
Let's talk.

From website design & SEO through to custom WordPress plugin development. I transform ideas into dynamic, engaging, and high-performing solutions.

Phil Kurth, web designer and developer in Geelong