Design Lounge
Install

Type

Studio Display

Fieldwork

Open studio, 14–16 May

Three floors of prints, prototypes and the furniture we built when the budget ran out.

Tokens

The pairing as CSS

/* Studio Display · type pairing · Designed using Design Lounge (https://www.designlounge.live) */
@import url("https://fonts.googleapis.com/css2?family=Syne:wght@400;600;800&family=Manrope:wght@400;500;700&display=swap");

:root {
  --font-display: "Syne", "Helvetica Neue", Arial, sans-serif;
  --font-text: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
}
h1, h2, h3, .display {
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1;
}
body {
  font-family: var(--font-text);
  font-weight: 400;
  line-height: 1.55;
}
/* No mono in this pairing. Code uses the system mono; amounts stay in the text face with even-width digits. */
code, kbd, samp, .mono {
  font-family: var(--font-mono);
}
.num {
  font-family: var(--font-text);
  font-variant-numeric: tabular-nums;
}