## `system-ui`

<p style="font-family: system-ui">
The quick brown fox jumps over the lazy dog. 0123456789
</p>

## `ui-rounded`

<p style="font-family: ui-rounded">
The quick brown fox jumps over the lazy dog. 0123456789
</p>

## `ui-serif`

<p style="font-family: ui-serif">
The quick brown fox jumps over the lazy dog. 0123456789
</p>

## `ui-monospace`

<p style="font-family: ui-monospace">
The quick brown fox jumps over the lazy dog. 0123456789
</p>

## `-apple-system`

<p style="font-family: -apple-system">
The quick brown fox jumps over the lazy dog. 0123456789
</p>
View Compiled
h2 {
  margin-bottom: 0;
  font-size: 10pt;
}

p {
  margin-top: 0.3em;
  font-size: 16pt;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.