Presetscope

WordPress builds the final theme.json data by merging three layers: core defaults, the active theme (and its parent), and the changes saved in the Site Editor. When a colour, font size or spacing value is not what you expect, it can be hard to see which layer it came from.

Presetscope is a theme.json inspector. It adds a screen under Tools → Presetscope that shows this merged data:

• Overview – the active theme, its parent, whether it is a block theme, the theme.json version of the theme and how many presets it defines.
• Presets – every colour, gradient, font size, font family, spacing size and shadow preset, with its CSS custom property (for example --wp--preset--color--contrast), its value, a colour sample and where it comes from (default, theme or custom).
• Settings and Styles – the merged data as formatted JSON.
• Generated CSS – the global stylesheet WordPress prints on the front end.

You can switch between the data with and without the Site Editor changes, to see what the theme itself provides.

It works with block themes and classic themes.

Read-only

The screen only reads data through WordPress’ public functions (wp_get_global_settings(), wp_get_global_styles() and wp_get_global_stylesheet()). It does not change the theme, the Site Editor data or any option, and it stores nothing in the database. Only users who can edit theme options (administrators by default) can see it.

Nothing is sent to any external service.

Presetscope is an independent project and is not affiliated with or endorsed by the WordPress project.