Can I only change overline text's size?

Store Design

Topic summary

Main issue: Increase the font size of “overline” text (e.g., the first line like “WE ARE A”) without changing other elements.

Initial fix: A CSS rule added in theme.liquid targeting .stacked-text–overline h3 (e.g., font-size: 30px !important) partially worked—some overlines updated, others did not.

Follow-up diagnosis: Different sections use different markup for overlines. Some are h3 inside .stacked-text–overline, while others are h4 elements with a data attribute (h4[data-item=“overline”]).

Expanded fixes suggested:

  • Add CSS for h4[data-item=“overline”] { font-size: 20px !important; } in theme.liquid.
  • Alternatively, place .stacked-text–overline h3 { font-size: 25px !important; } at the bottom of Assets > theme-critical.css to ensure stronger override.

Outcome and status: The OP confirmed the first solution helped and reported partial application; further CSS selectors were provided. No confirmation yet that all overlines are resolved, so the thread remains open.

Technical notes: Edit via Online Store > Themes > Edit code. Use !important to override theme defaults. Screenshots illustrate which sections changed vs. not changed.

Summarized with AI on December 28. AI used: gpt-5.
7

Hi @KimKimKimKim

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > theme–critical.css and paste this at the bottom of the file:
.stacked-text--overline h3 {
font-size: 25px!important;
}