From Uncode version 2.9.0, new features have been introduced to meet the specific requests of our users, such as the ability to create custom font sizes on-the-fly for use on a single page, and more options to define the responsiveness of font sizes, especially for headings, on different devices.

Custom Font Size

The Heading module and other major modules of the Page Builder now include an option in the Font Size dropdown labeled 'Custom’, screenshot .

Selecting this option opens a new input field where you can specify a font size. This field accepts all common CSS font size values, such as, screenshot :

• 135px
• 8em
• 6vw
• 5vh
• clamp(30px, 6vw, 125px)

While global font management through Theme Options is recommended for consistency across your site, this new feature provides flexibility for page-specific customizations.

Automatic Responsive Font Size

Uncode automatically adjusts font sizes larger than 35px on tablets and mobile devices, streamlining the responsive design process. This automatic scaling has been a foundational feature of Uncode, simplifying typography management across devices, screenshot .

Custom Responsive Font Size with Clamp

From version 2.9.0, Uncode supports various methods for managing responsive font sizes, including the CSS clamp() function, which offers a sophisticated way to create fluid typography, screenshot .

The clamp() function ensures text scales efficiently within a set range:

• Minimum: The smallest size the font can scale down to (ideal for mobile devices).
• Preferred: The size that the font will scale to across different screens, using relative units like vw or vh.
• Maximum: The largest size the font will scale up to (intended for desktop displays).

Examples of clamp() usage include:

• clamp(20px, 5vw, 100px)
• clamp(200px, 40%, 400px)
• clamp(20rem, 30vw, 70rem)
• clamp(min(10vw, 20rem), 300px, max(90vw, 55rem))

New values accepted in Theme Options

The Theme Options now also accept new units of measure for defining default heading sizes (h1, h2, h3, h4, h5, h6) screenshot, and for crafting custom font sizes, offering greater flexibility and precision in your site's typography settings, screenshot .