CDN

Typeweave provides a CDN for niche use cases where a stable font file link is required. All fonts are served through our global CDN infrastructure.

Note: We recommend self-hosting your fonts via NPM packages if possible for better performance, but we understand there are suitable use cases for a CDN.

Usage

To use Typeweave's CDN, simply add a link tag to your HTML <head>:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>My Website</title>

    <!-- Typeweave CDN -->
    <link rel="stylesheet" href="https://typeweave.com/api/fonts/inter/css" />
  </head>
  <body>
    <h1>Hello World</h1>
  </body>
</html>

URL Format

Typeweave CDN URLs follow this simple pattern:

https://typeweave.com/api/fonts/[font-id]/css

Where [font-id] is the lowercase font identifier with spaces and special characters removed.

Examples

Here are some example CDN URLs for popular fonts:

Inter - Modern UI font

<link rel="stylesheet" href="https://typeweave.com/api/fonts/inter/css" />

Roboto - Google's sans-serif

<link rel="stylesheet" href="https://typeweave.com/api/fonts/roboto/css" />

Playfair Display - Elegant serif

<link rel="stylesheet" href="https://typeweave.com/api/fonts/playfairdisplay/css" />

Open Sans - Humanist sans-serif

<link rel="stylesheet" href="https://typeweave.com/api/fonts/opensans/css" />

Roboto Mono - Monospace font

<link rel="stylesheet" href="https://typeweave.com/api/fonts/robotomono/css" />

Using in CSS

After adding the CDN link, use the font in your CSS:

body {
  font-family: 'Inter', sans-serif;
  font-weight: 400; /* 100-900 available for variable fonts */
}

h1 {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
}

.serif-text {
  font-family: 'Playfair Display', serif;
  font-weight: 600;
}

Loading Multiple Fonts

You can load multiple fonts by adding multiple link tags:

<head>
  <!-- Sans-serif for body text -->
  <link rel="stylesheet" href="https://typeweave.com/api/fonts/inter/css" />

  <!-- Serif for headings -->
  <link rel="stylesheet" href="https://typeweave.com/api/fonts/playfairdisplay/css" />

  <!-- Monospace for code -->
  <link rel="stylesheet" href="https://typeweave.com/api/fonts/robotomono/css" />
</head>

Font ID Reference

Font IDs are lowercase with spaces and special characters removed. Here's a quick reference:

Font Name	Font ID
Inter	inter
Open Sans	opensans
Playfair Display	playfairdisplay
Roboto Mono	robotomono
Plus Jakarta Sans	plusjakartasans
etc...	See documentation for full list

For a complete list of all available fonts and their IDs, see the Available Fonts section.