Создание интересных типографических эффектов с использованием росчерков шрифтов OpenType

Демонстрация работы росчерков шрифтов, адаптация примера из урока Dudley Storey, специально для сайта dejurka.ru

HTML

<h2>Absolutely Fabulous</h2><br/><br/>
<h2>Absolutely Fabulous</h2>

CSS

@font-face {
font-family: 'French Canon'; 
src: url('http://thenewcode.com/assets/fonts/french-canon.woff') format('woff'),
url('http://thenewcode.com/assets/fonts/french-canon.ttf') format('truetype');
src: url('http://thenewcode.com/assets/fonts/french-canon.otf');
font-weight: 100;
font-style: normal;
}

h2 {
display: inline-block;
font-weight: 100;
font-size: 6vw;
line-height: 1;
color: hsl(30, 92%, 50%);
margin: 0;
font-family: 'French Canon', cursive;
text-align: left;
}
h2:nth-of-type(2)  {
font-feature-settings: "swsh";  
}