> For the complete documentation index, see [llms.txt](https://uxsmart.gitbook.io/velare/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://uxsmart.gitbook.io/velare/help-and-faqs/how-do-i-change-the-font-size-on-mobile-and-desktop-separately.md).

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

### What you are seeing <a href="#what-you-are-seeing" id="what-you-are-seeing"></a>

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 <a href="#why-it-happens" id="why-it-happens"></a>

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 behaviour 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 <a href="#what-you-can-do" id="what-you-can-do"></a>

**If the desktop size is what you want to change**, use the normal controls in [Typography](/velare/set-up-your-store/typography.md). Mobile follows automatically.

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

{% hint style="success" %}
**Steps:**

1. Add custom CSS rules that set the font size per device.
2. Keep your own copy of the rules somewhere outside the theme.
3. Reapply them after every theme update.
   {% endhint %}

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

{% hint style="info" %}
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.
{% endhint %}

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

### When to contact support <a href="#when-to-contact-support" id="when-to-contact-support"></a>

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: **Vélare 1.0.0**, shown under the theme name in **Online Store > Themes**.
* A [staff account](/velare/help-and-faqs/staff-account.md) for the support team, since this change is made in the theme itself.

### Related pages <a href="#related-pages" id="related-pages"></a>

* [Typography](/velare/set-up-your-store/typography.md): the fonts and desktop font sizes used across the store
* [Custom CSS](/velare/customize-your-pages/custom-css.md): where custom rules go, and what an update does to them
* [The desktop screen look more like on a tablet](/velare/help-and-faqs/the-desktop-screen-look-more-like-on-a-tablet.md): why the editor preview is not a reliable way to judge sizes
* [Staff account](/velare/help-and-faqs/staff-account.md): how to give the support team access to your store


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://uxsmart.gitbook.io/velare/help-and-faqs/how-do-i-change-the-font-size-on-mobile-and-desktop-separately.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.