Responsive Typography for Text Styles (Desktop / Tablet / Mobile)

Currently, Shop / Brand Library Text Styles are not breakpoint-aware. Each style (H1, H2, Body, etc.) applies the same font size and line height across all devices.

To create responsive typography, users must duplicate styles (e.g. H1 Desktop + H1 Mobile) and manually apply them per breakpoint.

Problem

• Typography often doesn’t translate well from desktop to mobile

• Requires duplicating every semantic style per breakpoint

• Updates become time-consuming and error-prone

• Reduces the value of having a centralized style system

Request
Allow a single Text Style to define responsive values per breakpoint (Desktop / Tablet / Mobile).

Example:

• H1: 48px (desktop) / 40px (tablet) / 32px (mobile)

This would keep styles semantic while automatically adapting typography across devices.

Why it matters

This would significantly improve:

• Design system scalability

• Mobile readability

• Consistency across pages

• Workflow efficiency (less duplication and manual overrides)