Type in use across the Mutqin identity

Identity

Typography

Manrope for everything, Playfair italic for one phrase.

Two faces. Manrope does the work; Playfair appears once per headline to give a line an edge that a bold weight cannot. Most brands reach for a third typeface at exactly the point where they should be cutting words instead.

The faces

  • Manrope

    Everything

    Excellence is a standard, not a slogan.

    Headlines, body, navigation, labels. One family across four weights does the whole job, and the restraint is the point.

    next/font/google as --font-sans
  • Playfair Display Italic

    One phrase

    clarity, precision and results

    Loaded in italic alone. It marks a single phrase inside a headline and never runs longer than that.

    next/font/google as --font-serif — italic only

The scale

Six roles. If a piece of text is not one of these, it is body.

RoleSpecFace and use
Hero64px, 700, -0.02emManrope Bold — The opening headline. One per page.
Section heading40–44px, 700, -0.02emManrope Bold — The heading that opens a section.
Editorial accentmatches its heading, 400, italicPlayfair Display Italic — One highlighted phrase inside a headline. Never a whole sentence.
Body16px, 400, 1.7Manrope Regular — Everything you actually read. Short sentences, no filler.
UI & navigation14–16px, 500Manrope Medium — Buttons, nav links, form labels.
Label10–12px, 700, 0.18em, uppercaseManrope Bold — The small label above a heading.

Never

Playfair is loaded in italic only. Setting it upright falls back to Georgia and quietly changes the brand. If a design calls for an upright serif, the answer is that it does not.

Rules

Do: One hero-size headline per page. Everything under it steps down.

Do: Colour the italic phrase with the accent cut that matches its background.

Do: Keep labels to a few words at 0.18em tracking, uppercase.

Do: Let body text breathe at 1.7 line height and stop lines around 70 characters.

Do not: Do not italicise a whole sentence. One phrase, inside a headline.

Do not: Do not add a third typeface, including for a single asset.

Do not: Do not set body copy below 16px on a marketing page.

Do not: Do not use tight tracking on small text. It is for display sizes only.