Font size in `theme.json` for default font sizes ignored

[strarsis]

Description

The font sizes for default font sizes in theme.json are ignored.

Step-by-step reproduction instructions

1. Define some custom font sizes in theme.json for default font sizes in test theme.

{
  "settings": {
    "typography": {
      "customFontSize": false,
      "fontSizes": [
        {
          "slug": "smallest",
          "size": "2rem",
          "name": "Smallest"
        },
        {
          "slug": "smaller",
          "size": "2rem",
          "name": "Smaller"
        },
        {
          "slug": "medium",
          "size": "2rem",
          "name": "Medium"
        },
        {
          "slug": "larger",
          "size": "2rem",
          "name": "Larger"
        },
        {
          "slug": "very-large",
          "size": "2rem",
          "name": "Very large"
        },
        {
          "slug": "x-large",
          "size": "2rem",
          "name": "Huge"
        }
      ],
      "fluid": false
    }
  }
}

2. Ensure the test theme is activated.
3. Load theme page, note that the default font sizes are not used from theme.json.

Screenshots, screen recording, code snippet

--wp--preset--font-size--small: 13px;
--wp--preset--font-size--medium: 20px;
--wp--preset--font-size--large: 36px;
--wp--preset--font-size--x-large: 42px;

Environment info

• WordPress 6.7.2

Please confirm that you have searched existing issues in the repo.

• Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

• Yes

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure

[strarsis]

Addendum: Apparently the behavior in Gutenberg in WordPress core has changed: defaultFontSizes must be set to false.

[im3dabasia]

Thank you @strarsis for raising the issue.

The current behavior in Gutenberg will show both the custom font sizes and the default ones in the editor. If we want to hide the default ones, we can use defaultFontSizes and set it to false under the typography settings (as you rightly mentioned). I tested and I was able to use the font sizes added in the theme.json.

Attaching the video reference. Do let me know if I am missing anything.

Screen.Recording.2025-03-17.at.1.02.39.PM.mov

[t-hamano]

The current behavior in Gutenberg will show both the custom font sizes and the default ones in the editor. If we want to hide the default ones, we can use defaultFontSizes and set it to false under the typography settings (as you rightly mentioned). I tested and I was able to use the font sizes added in the theme.json.

Note that this behavior is valid for API version 3. See Migrating from v2 to v3 section.

I think this is not a bug, so I'd like to close this issue.

[strarsis]

@t-hamano: Would a theme made for v2 API break with newer core (and Gutenberg) version v3 API?

[t-hamano]

I'm not sure if I understand your question correctly, but older theme.json should continue to work in the future.

From this document: https://github.com/WordPress/gutenberg/blob/trunk/docs/reference-guides/theme-json-reference/theme-json-migrations.md

Using older versions will continue to be supported.

[webfolkcreative]

I might be missing something, but my understanding is:
If I set settings.typography.defaultFontSizes to false, a user can modify the font size.

However, when I set it to false, nothing changes at all, the font-size is still set to 13, despite changing it. Am I missing something? Strangely my fonts were working as expected yesterday evening, without settings.typography.defaultFontSizes, and today there's issues with the font sizes.

[t-hamano]

@webfolkcreative Can you provide your theme.json file? Note that the settings.typography.defaultFontSizes behaves differently according to the API version.

See https://github.com/WordPress/gutenberg/blob/trunk/docs/reference-guides/theme-json-reference/theme-json-migrations.md#settingstypographydefaultfontsizes