Limit Gutenberg Colors

Limit WordPress Gutenberg to only your brand colours

Ok, so this one isn't new (original source - Rich Tabor), but I've added it here again, partly so that I can find it, but also in case someone else finds it useful. I find that it's really helpful to limit the colour pallete that's available in Gutenberg - partly so that the brand colours are readily available, but also to prevent the over-enthusiastic from trying to be too creative ;)

On this site, I have the following colours (you can add more if you want). To achieve this, simply add the following to your theme functions.php file.

/**
 * Add support for custom color palettes in Gutenberg.
 */
function tabor_gutenberg_color_palette() {
    add_theme_support(
        'editor-color-palette', array(
            
            array(
                'name'  => esc_html__( 'Green', '@@textdomain' ),
                'slug' => 'green',
                'color' => '#7bba66',
            ),
            array(
                'name'  => esc_html__( 'White', '@@textdomain' ),
                'slug' => 'white',
                'color' => '#FFFFFF',
            ),
            array(
                'name'  => esc_html__( 'Black', '@@textdomain' ),
                'slug' => 'black',
                'color' => '#000000',
            ),
            array(
                'name'  => esc_html__( 'Light Grey', '@@textdomain' ),
                'slug' => 'light_grey',
                'color' => '#e6e7e8',
            ),

        )
    );
}
add_action( 'after_setup_theme', 'tabor_gutenberg_color_palette' );
// disable custom colours
add_theme_support( 'disable-custom-colors' );
Get in touch...

Titus Design

4 Apperley Park, Apperley, Gloucester, GL19 4EB
+44 (0)1452 780621

Specialising in responsive Wordpress website design, development, hosting, site optimisation, digital marketing, as well as graphic design for print.

[snow flakes='60' shadow='true']
We recommend
email anti spam software
by MX GuardDog
cookie settings