CSS
p {
font-family: "Inter", "Segoe UI", sans-serif;
font-size: 16px;
font-weight: 400; /* 400 = normal, 700 = bold */
font-style: italic; /* normal | italic | oblique */
}Font stacks
font-family takes a fallback list — the browser uses the first
font it has installed, ending in a generic family (sans-serif, serif,
monospace) so there's always something reasonable if none of your
named fonts load.
Web fonts
To use a font that isn't pre-installed on the visitor's device, either link a hosted service like Google Fonts:
HTML
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700" rel="stylesheet">or self-host with @font-face:
CSS
@font-face {
font-family: "MyFont";
src: url("myfont.woff2") format("woff2");
}
body {
font-family: "MyFont", sans-serif;
}