Adding a Custom Color Palette to Gutenberg with PHP

If your WordPress site uses a classic theme (non-block theme), the method for registering custom colors in the Gutenberg block editor is through PHP in your functions.php file. PaletteRx generates this code for you.

The PHP Snippet

PaletteRx's Gutenberg PHP export generates a ready-to-paste add_theme_support('editor-color-palette') block:

add_theme_support('editor-color-palette', array(
  array(
    'name'  => 'Primary',
    'slug'  => 'primary',
    'color' => '#4f46e5',
  ),
  array(
    'name'  => 'Dark Base',
    'slug'  => 'dark-base',
    'color' => '#1a1a2e',
  ),
  // ... more colors
));

What This Does

This replaces the default Gutenberg color palette with your custom palette. When content editors use the block editor, they see your brand colors in every color picker instead of Gutenberg's generic defaults. WordPress automatically generates CSS classes like .has-primary-color and .has-primary-background-color for each entry.

Where to Paste It

Add the snippet to your theme's functions.php, ideally inside an after_setup_theme action hook. If you are using a child theme, add it to the child theme's functions.php to prevent losing changes on theme updates.

Block Theme Alternative

If your theme is a full block theme (has a templates/ directory and theme.json), use PaletteRx's theme.json export instead. The PHP method is specifically for classic themes that do not use theme.json for configuration.