EXAMPLE
Run
<!DOCTYPE html>
<html>

<head>
	<title>The font-optical-sizing property in CSS</title>
	<style type="text/css">
		@font-face {
		    src: url('AmstelvarAlpha-VF.ttf');
		    font-family:'Amstelvar';
		    font-style: normal;
		}
		
		p {
		  font-size: 36px;
		  font-family: Amstelvar;
		  font-optical-sizing: auto;
		}
		
		.auto-optical-sizing {
		  font-optical-sizing: auto;
		}
		.h1{
			font-optical sizing: auto;
		}
	</style>
</head>

<body>
	<h1> CHAPTER 1 </h1>
	<p class="optical-sizing">This paragraph is optically sized. This is the default across browsers.</p>
	<p class="auto-optical-sizing">This paragraph is not optically sized. You should see a difference in supporting browsers.</p>
</body>

</html>