4P by xguru 2019-09-27 | favorite | 댓글과 토론

웹상에서 폰트 크기를 줄이기 위해 몇개의 마스터 스타일을 지정하고, 축(axis)를 추가함으로써 수십개 이상의 파생된 인스턴스들을 생성하는 것.
CSS 를 통해서 각 Variation 을 선택 가능.

@supports (font-variation-settings: 'wdth' 200) {
@font-face {
/* https://github.com/TypeNetwork/Amstelvar */
font-family: AmstelvarAlpha;
src: url('../fonts/AmstelvarAlpha-VF.ttf');
font-weight: normal;
font-style: normal;
}

#font-amstelvar {
font-family: AmstelvarAlpha;
font-variation-settings: 'wdth' 400, 'wght' 98;
}
}