font-family-system-ui
v0.0.1
Published
Poor man's `font-family: system-ui` implementation
Downloads
23
Maintainers
Readme
font-family-system-ui
The upcoming CSS 4 specification promises us a new generic font family,
system-ui
,
representing the default UI font on a given platform. This is a poor man's
(but future-proof) font-family: system-ui
implementation.
Note that because the @font-face
rule doesn't give us a syntax for defining
a new font family alias based on a predefined generic family such as -apple-system
,
implementing this as a polyfill is possible
but would sacrifice the quality of implementation, thus a CSS utility class.
##Installation
##Usage
HTML:
<p class="u-font-family-system-ui">Sic transit gloria mundi</p>
CSS et al.:
p {
.u-font-family-system-ui; /* Less */
@extend .u-font-family-system-ui; /* Sass */
composes: .u-font-family-system-ui; /* CSS Modules */
font-size: 1rem;
}
##References
- https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical-guide/
- https://www.chromestatus.com/feature/5640395337760768