← ALL PAIRS

MERRIWEATHER + OPEN 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.

MERRIWEATHER

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

OPEN SANS

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

CHARACTER SET · MERRIWEATHER

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
!
@
#
$
%
&
*
(
)
?
.
,
;
:
+
=

OPEN 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/merriweather @fontsource/open-sans

# yarn
yarn add @fontsource/merriweather @fontsource/open-sans

# pnpm
pnpm add @fontsource/merriweather @fontsource/open-sans

# Then import in your app entry point:
import '@fontsource/merriweather';
import '@fontsource/open-sans';

# CSS usage after import:
# font-family: 'Merriweather', serif;
# font-family: 'Open Sans', sans-serif;

ABOUT

Merriweather

A text serif designed specifically for screen by Sorkin Type. Its large x-height, low contrast, and sturdy serifs ensure excellent readability at small sizes on any display.

Sorkin Type, 2010

serif · 14 styles

Variable · Italic

Recommended: 400, 700, 900

Available: 300900

→ Google Fonts ↗

Open Sans

One of the most widely used fonts on the web, designed by Steve Matteson. A humanist sans-serif optimized for legibility across print, web, and mobile with neutral, friendly forms.

Steve Matteson, 2011

sans-serif · 12 styles

Variable · Italic

Recommended: 400, 600

Available: 300800

→ Google Fonts ↗

Two screen-optimized workhorses. Merriweather's generous x-height meets Open Sans's neutral clarity. Great for long-form reading, documentation, and educational content.

MERRIWEATHER × OPEN SANS03 / 38