<!DOCTYPE html>
<html>
	<head>
        <meta charset="utf-8" />
		<title>SystemFont</title>
		<style type="text/css">
		p.system-font { font-family: -webkit-system-font }
		p.system-ui { font-family: -webkit-system-ui }
		</style>
	</head>
	<body>
		<p class="system-font">System font</p>
		<p class="system-font"><i>Italic system font</i></p>
		<p class="system-font"><b>Bold system font</b></p>
		<p class="system-font"><i><b>Bold italic system font</b></i></p>

		<p class="system-ui">System font</p>
		<p class="system-ui"><i>Italic system font</i></p>
		<p class="system-ui"><b>Bold system font</b></p>
		<p class="system-ui"><i><b>Bold italic system font</b></i></p>

		<p class="system-font" style="font-size: 24px">System font</p>
		<p class="system-font" style="font-size: 12pt"><i>Italic system font</i></p>
		<p class="system-font" style="font-size: small"><b>Bold system font</b></p>
		<p class="system-font" style="font-size: 2em"><i><b>Bold italic system font</b></i></p>
	</body>
</html>
