System Font Stacks

My preferred system font stacks are as follows:

html, button, input {
  font-family: -apple-system, 'Segoe UI', 'DejaVu Sans',
    system-ui, sans-serif;
}

code, kbd, pre, samp {
  font-family: 'SF Mono', SFMono-Regular, ui-monospace,
    'DejaVu Sans Mono', Menlo, 'Cascadia Mono', monospace;
}

(The CSS selectors are provisionary.)

System Fonts

Font family nameWhy
-apple-systemApple
Segoe UIWindows
DejaVu SansLinux
system-uiGeneric font family
sans-serifCatch-all

Monospaced Fonts

Font family nameWhy
SF MonoApple
SFMono-RegularApple
ui-monospaceApple Safari
DejaVu Sans MonoBitstream Vera Sans Mono (Linux)
MenloBitstream Vera Sans Mono (Apple)
Cascadia MonoWindows
monospaceGeneric font family