← ALL PAIRS

DM SERIF DISPLAY + DM SANS

The Quick Brown Fox Jumps Over The Lazy Dog
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line-spacing, and letter-spacing, as well as modifying the space between pairs of letters.

DM SERIF DISPLAY

Regular 400The quick brown fox jumps over the lazy dog

Single weight — display use only

DM SANS

Thin 100The quick brown fox jumps over the lazy dog
ExtraLight 200The quick brown fox jumps over the lazy dog
Light 300The quick brown fox jumps over the lazy dog
Regular 400The quick brown fox jumps over the lazy dog
Medium 500The quick brown fox jumps over the lazy dog
SemiBold 600The quick brown fox jumps over the lazy dog
Bold 700The quick brown fox jumps over the lazy dog
ExtraBold 800The quick brown fox jumps over the lazy dog
Black 900The quick brown fox jumps over the lazy dog

CHARACTER SET · DM SERIF DISPLAY

Aa
Bb
Cc
Dd
Ee
Ff
Gg
Hh
Ii
Jj
Kk
Ll
Mm
Nn
Oo
Pp
Qq
Rr
Ss
Tt
Uu
Vv
Ww
Xx
Yy
Zz
0
1
2
3
4
5
6
7
8
9
!
@
#
$
%
&
*
(
)
?
.
,
;
:
–
+
=

DM SANS

Aa
Bb
Cc
Dd
Ee
Ff
Gg
Hh
Ii
Jj
Kk
Ll
Mm
Nn
Oo
Pp
Qq
Rr
Ss
Tt
Uu
Vv
Ww
Xx
Yy
Zz
0
1
2
3
4
5
6
7
8
9
!
@
#
$
%
&
*
(
)
?
.
,
;
:
–
+
=

USE THIS PAIR

# npm
npm install @fontsource/dm-serif-display @fontsource/dm-sans

# yarn
yarn add @fontsource/dm-serif-display @fontsource/dm-sans

# pnpm
pnpm add @fontsource/dm-serif-display @fontsource/dm-sans

# Then import in your app entry point:
import '@fontsource/dm-serif-display';
import '@fontsource/dm-sans';

# CSS usage after import:
# font-family: 'DM Serif Display', serif;
# font-family: 'DM Sans', sans-serif;

ABOUT

DM Serif Display

The display serif companion to DM Sans, designed by Colophon Foundry. High-contrast forms with sharp terminals create immediate visual impact at large sizes. Single weight, best used for headlines only.

Colophon Foundry, 2019

serif · 2 styles

Italic

Recommended: 400

→ Google Fonts ↗

DM Sans

A geometric sans-serif designed by Colophon Foundry for DeepMind. Features low-contrast strokes, open apertures, and a friendly character that makes it one of the most versatile UI faces available.

Colophon Foundry, 2019

sans-serif · 18 styles

Variable · Italic

Recommended: 400, 500, 700

Available: 100–900

→ Google Fonts ↗

Same foundry, same DNA. DM Serif Display's high contrast display forms paired with DM Sans's geometric body. Natural harmony. Perfect for editorial sites, product announcements, and refined marketing pages.

eleganteditorial

RELATED PAIRS

DM SERIF DISPLAY × DM SANS27 / 38