Byte Digital Themes

Typography

Heading, body, nav and caption font families plus sizes for every level.

Updated 2026-05-09

Theme settings → Typography.

Four font roles

Dost uses four independent font picks so you can mix a serif heading with a sans body without changing anything else.

RoleUsed for
HeadingAll h1–h6 (product titles, section headings, hero text)
BodyParagraphs, descriptions, prices, buttons
NavHeader menu items, breadcrumbs, footer links
CaptionLabels, badges, eyebrows, meta text

Each role uses Shopify's font picker — you can pick any font from Shopify's library or upload a custom font (Settings → Files in Shopify admin, then point a font_picker to it via custom code if needed).

Performance note: Heading and body fonts are preloaded with font-display: optional (won't cause layout shift on slow networks). Nav and caption fonts use font-display: swap since they're below the fold.

Font sizes

Each text level has its own pixel size:

SettingDefaultUsed for
font_size_h135pxSection headings, page titles
font_size_h252pxEditorial heroes, big section heads
font_size_h332pxSub-headings
font_size_h422pxCard titles, accordion triggers
font_size_h518pxSmall headings
font_size_h614pxTiny headings
font_size_logo24pxText logo if no logo image is set
font_size_md16pxBody text
font_size_sm13pxSmall body, secondary descriptions
font_size_caption13pxImage captions, footnotes
font_size_label10pxUPPERCASE labels, badges, breadcrumbs
font_size_button12pxButtons
font_size_nav12pxHeader / footer navigation
font_size_drawer_title20pxCart drawer header

Many sections expose their own size multiplier (e.g., Hero heading size: small / medium / large). Those multiply the global sizes above. Dost intentionally avoids per-section pixel inputs to keep type rhythm consistent.

Letter-spacing

Theme settings → Typography → Letter-spacing:

  • Nav (default 1500.150em)
  • Label (default 1000.100em)
  • Button (default 1200.120em)

The numeric value is in 1000ths of an em. 120 = 0.12em.

Uppercase toggles

Three independent switches:

  • Uppercase nav
  • Uppercase label
  • Uppercase button

Turn them off if you prefer sentence-case across the theme.

Font preview tips

After picking a font, open a product page in preview — heading and body interact with each other in product titles, descriptions, and price blocks. The combo that looks great on the homepage may feel cramped on PDP. Always preview both.

Need a hand? Contact support.