Barlow Semi Condensed Font — Free Google Fonts Specimen

Specimen

Barlow Semi Condensed

The quick brown fox jumps over the lazy dog

Typography is the craft of endowing human language with a durable visual form. It connects the smallest mark on a page to the largest cultural questions a society can ask of itself.

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 .,;:!?&@#$%

Weights and styles

Every weight in the family, rendered live in Barlow Semi Condensed from the Google Fonts CDN.

Thin · 100 The quick brown fox jumps

Thin Italic · 100 The quick brown fox jumps

Extra Light · 200 The quick brown fox jumps

Extra Light Italic · 200 The quick brown fox jumps

Light · 300 The quick brown fox jumps

Light Italic · 300 The quick brown fox jumps

Regular · 400 The quick brown fox jumps

Regular Italic · 400 The quick brown fox jumps

Medium · 500 The quick brown fox jumps

Medium Italic · 500 The quick brown fox jumps

Semi Bold · 600 The quick brown fox jumps

Semi Bold Italic · 600 The quick brown fox jumps

Bold · 700 The quick brown fox jumps

Bold Italic · 700 The quick brown fox jumps

Extra Bold · 800 The quick brown fox jumps

Extra Bold Italic · 800 The quick brown fox jumps

Black · 900 The quick brown fox jumps

Black Italic · 900 The quick brown fox jumps

CSS embed code

Drop the @import or <link> tag into the head of your document, then declare the family in your stylesheet.

CSS @import

/* Add to the top of your CSS file */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed:wght@100;200;300;400;500;600;700;800;900&display=swap');
/* Then use the family */
body {
  font-family: 'Barlow Semi Condensed', sans-serif;
}

HTML <link>

<!-- Add inside <head> -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">