We can du this by using the font-family property.
The font-family CSS property specifies a prioritised list of one or more font family names and/or generic family names for the selected element.
Values are separated by commas to indicate that they are alternatives (font stack). The browser will select the first font in the list that is installed or that can be downloaded using a @font-face at-rule.
You should always include at least one generic family name in a font-family list, since there's no guarantee that any given font is available. This lets the browser select an acceptable fallback font when necessary.
/* A font family name and a generic family name */
font-family: Gill Sans Extrabold, sans-serif; /* Should this have quotation marks? */
font-family: "Goudy Bookletter 1911", sans-serif;
/* A generic family name only */
font-family: serif;
font-family: sans-serif;
font-family: monospace;
font-family: cursive;
font-family: fantasy;
font-family: system-ui;
font-family: ui-serif;
font-family: ui-sans-serif;
font-family: ui-monospace;
font-family: ui-rounded;
font-family: emoji;
font-family: math;
font-family: fangsong;
/* Global values */
font-family: inherit;
font-family: initial;
font-family: unset;Source: https://developer.mozilla.org/en-US/docs/Web/CSS/font-family