Puffy Perfect -^ <->
.container1 * { font-variant-ligatures: common-ligatures discretionary-ligatures contextual; } .inactive .container1 * { font-variant-ligatures: none; }
<div class="container container1"> <p>Puffy Perfect -^ <-></p> </div>
Ligatures active
Puffy Perfect -^ <->
/* 'liga', 'dlig', 'hlig', 'calt' */ .container2 * { font-feature-settings: 'dlig', 'liga', 'calt'; } .inactive .container2 * { font-feature-settings: 'dlig' 0, 'liga' 0, 'calt' 0; }
<div class="container container2"> <p>Puffy Perfect -^ <-></p> </div>
Ligatures active