landwire

Theme Yaml converts your theme.yaml file into theme.json so that you can configure your theme with YAML. It has the benefit of being able to add comments and is more concise than JSON. The generated theme.json is left as a one liner by default, so that you can see it is generated. This however can be changed through the ‘theme_yaml_json_pretty_print’ filter.
The plugin automatically looks for a theme.yaml file in the active theme’s root folder when a page is loaded. If found, it will check its last modified time and store the value in the database. If there are new modifications, the plugin parses theme.yaml, converts it to JSON, and writes it to the theme.json file.
If the active theme is a child, it will also automatically run through this process for its parent.
<h3>Configuration</h3>
Add a theme.yaml file with your theme settings in your theme’s root directory. If you already have an existing theme.json file, you can convert it to the YAML format using an online tool. I personally use https://www.json2yaml.com/. The plugin will then convert the theme.yaml file into JSON and save it to the theme.json file.

Theme YAML – Use YAML instead JSON for your theme.json settings and styles

This plugin comes in pretty handy when developing block themes - since handling an ever-growing theme.json file really sucks and you can't even use basic features like comments, etc. But no more, with "Theme YAML" i can finally write and maintain readable global styles and theme settings without a hassle :)
Very easy to use, there are no settings: Just install, activate and you're basically good to go!

Really useful!

Theme Yaml converts your theme.yaml file into theme.json so that you can configure your theme with YAML

sulaimandauda

Theme.json Design Manager provides a user-friendly admin interface for managing design tokens that are automatically merged into your theme’s <code>theme.json</code> Global Styles pipeline. No code editing required.
<h4>Features</h4>
<ul>
<li>Color Palette — Define semantic color tokens with live contrast previews. Generates <code>--wp--preset--color--{slug}</code> CSS custom properties.</li>
<li>Spacing Scale — Create spacing tokens with drag-to-reorder support. Generates <code>--wp--preset--spacing--{slug}</code> CSS custom properties.</li>
<li>Typography Scale — Set font size tokens with optional fluid <code>clamp()</code> support. Generates <code>--wp--preset--font-size--{slug}</code> CSS custom properties.</li>
<li>Border Radius — Define radius presets. Generates <code>--wp--custom--border-radius--{slug}</code> CSS custom properties.</li>
<li>Shadow Presets — Create box-shadow tokens with live previews. Generates <code>--wp--preset--shadow--{slug}</code> CSS custom properties.</li>
<li>Hide Defaults — Optionally hide theme/core default presets from the editor for a clean, curated design system. CSS custom properties are preserved.</li>
<li>Reserved Slug Protection — Automatically detects and renames color slugs (e.g. “text”, “link”) that conflict with WordPress core CSS marker classes, preventing color override issues in the editor.</li>
<li>Diagnostics Tab — View runtime data including stored tokens, merged palette by origin, generated CSS variables, preset classes, and settings at a glance.</li>
</ul>
<h4>How It Works</h4>
The plugin stores design tokens in the WordPress database and merges them into the theme’s Global Styles via the <code>wp_theme_json_data_theme</code> filter. Tokens use WordPress’s native slug-based merge system — matching slugs are replaced, new slugs are appended.
All changes are fully reversible. Deactivating the plugin restores original theme styles.
<h4>Developer-Friendly</h4>
<ul>
<li>Filter hooks for extending tokens before merge (<code>gdtm_tokens_before_merge</code>)</li>
<li>Action hooks after save (<code>gdtm_after_save</code>) and for custom tab content (<code>gdtm_after_tab_content</code>)</li>
<li>Admin tab filter (<code>gdtm_admin_tabs</code>) for registering additional tabs</li>
</ul>

Theme.json Design Manager

Manage design tokens — colors, spacing, typography, border radius, and shadows — that integrate with WordPress Global Styles via theme.json.

Theme YAML – Use YAML instead JSON for your theme.json settings and styles vs Theme.json Design Manager