Parent issue:

• Tracking: fluid typography  #44888

What problem does this address?

Where fluid typography is enabled, minimum and maximum font sizes in presets can be calculated according to defined min and max values, e.g.,

{
    "size": "2rem",
    "fluid": {
        "min": "2rem",
        "max": "2.5rem"
    },
    "slug": "medium",
     "name": "Medium"
 },

For the above preset, the font size, regardless of the viewport, will not be larger than 2.5rem and it will not be smaller than 2rem.

Where min and max values are not supplied, either in theme.json font size presets or as a custom font size in styles, the min and max values are calculated from the size itself, e.g., minFontSize * DEFAULT_MINIMUM_FONT_SIZE_FACTOR.

Where the size is itself very large or very small, this could lead to readability issues in certain viewports.

The use of em for example might also cause issues if the relative parent's font size is set very small.

What is your proposed solution?

Add default minimum (and maximum?) font size limits so that text does not become smaller than n1 or bigger than n2.

Proposed minimum font size is 14px/0.875rem/0.875em.

The default limits can be configurable to allow themers more control and added in conjunction with:

• Fluid typography: add configurable settings for minimum font size to theme.json #42489

❗ What do we do with font sizes < 14px?

Users may define font-sizes that are smaller than 14px. IThe user-defined font size could be the minimum in a clamped value. For example if a user defines 9px for a block, then the minimum font size for that block will be 9px and a clamped value will be generated.

OR

Where users define font-sizes that are smaller than 14px in the editor or theme.json, and there is no specified minimum the value is not clamped (no fluidity).

cc @jasmussen @jffng