How to change the submenu font type dawn 2.0

Technical Q&A

Topic summary

Changing the Shopify Dawn 2.0 header submenu font independently from the main navigation font. The issue: submenu and main menu share styles in base.css, causing both to use the same font.

Early reply suggested adding a font via the theme editor (video link), but the requester clarified they only want to change the submenu font style, not install custom fonts.

Resolution provided by the original poster: edit Online Store → Theme → Edit code → Assets → base.css. Find the rule targeting “.header__submenu .header__menu-item { font-size: 15px; }” and replace it with a more specific anchor selector that sets a different font-family and keeps font-size 15px. The example uses a long selector for submenu items and applies font-family: “YOURFONTHERE” with !important to override defaults.

Technical notes: CSS (Cascading Style Sheets) controls visual styles; selector specificity targets submenu items; !important forces the rule to take precedence.

Outcome: Resolved with clear steps; no remaining open questions.

Summarized with AI on February 9. AI used: gpt-5.
4

Nevermind, I figured it out.

For anyone who might want to do this:

  1. Go to Online Store->Theme->Edit code

2. Asset->/base.css

Find the line of code that says this:

.header__submenu .header__menu-item {
  font-size: 15px;
}

Replace it with this:

a.header__menu-item.header__menu-item.list-menu__item.link.link--text.focus-inset.caption-large {
  font-family: "YOURFONTHERE" !important;
  font-size: 15px;
}