How do I change the font size on mobile and desktop separately?

What you are seeing

You set a font size in the theme settings and it looks right on desktop, but on a phone the same text feels too large or too small. You go looking for a separate mobile control in the theme editor and cannot find one.

Why it happens

The theme provides font size controls for desktop only. Mobile sizes are worked out automatically by the theme's built in responsive code, scaled from your desktop values, and there is no separate field for them in the Theme Editor.

So this is expected behavior rather than a fault. In most cases the automatic mobile size is the right one, and adjusting the desktop value moves both together.

What you can do

If the desktop size is what you want to change, use the normal controls in Typography . Mobile follows automatically.

If you genuinely need different sizes on the two devices, you have two options.

Steps:

Add custom CSS rules that set the font size per device.
Keep your own copy of the rules somewhere outside the theme.
Reapply them after every theme update.

Result: text is sized independently on mobile and desktop, at the cost of maintaining the code yourself.

Custom code is not preserved by the one click update feature. Anything you add has to be applied again after each update, which is why the copy kept outside the theme matters.

If you are not comfortable writing CSS, contact our support team and we will help with the customization.

When to contact support

Contact support when you want different mobile and desktop sizes and would rather not write the CSS yourself, or when text on mobile is not merely large but broken: overflowing its container, overlapping another element, or cut off at the edge of the screen. That is a layout problem, not a font size preference.

Send this with your first message:

Your store URL, and the URL of the page with the text.
Which text exactly, and what size you want on mobile and on desktop.
A screenshot from a real phone, with the device model and browser.
Theme name and version: Laurel 1.0.0, shown under the theme name in Online Store > Themes.
A staff account for the support team, since this change is made in the theme itself.

Typography : the fonts and desktop font sizes used across the store
Custom CSS: where custom rules go, and what an update does to them
The desktop screen look more like on a tablet: why the editor preview is not a reliable way to judge sizes
Staff account: how to give the support team access to your store