postcss-font-normalize

PostCSS plugin to normalize font-family

Usage no npm install needed!

<script type="module">
  import postcssFontNormalize from 'https://cdn.skypack.dev/postcss-font-normalize';
</script>

README

PostCSS Font Normalize Build Status

PostCSS plugin to normalize font-family.

input:

.absolute-font-size { font: x-large Arial, serif }
.font-size-with-line-height { font: x-large/110% Arial, serif }
.length-font-size-and-line-height { font: normal small-caps 120%/120% fantasy }
.bad-order { font: bold italic large Palatino, serif }

.ascii {
    font-family: Arial;
}
.lowercase {
    font-family: arial;
}
.unicode {
    font-family: 楷体;
}
.unicode-escape {
    font-family: \4EFF\5B8B;
}
.generic {
    font-family: Arial, 楷体, serif;
}
.blankspace {
    font-family: Tohama, Microsoft Yahei, sans-serif;
}
.all-in-one {
    font-family: Arial, \9ed1\4f53, 黑体, 华文细黑, sans-serif;
}
.good {
    font-family: Arial, "\9ed1\4f53", "黑体", "华文细黑", sans-serif;
}

output:

.absolute-font-size { font: x-large "Arial", serif }
.font-size-with-line-height { font: x-large/110% "Arial", serif }
.length-font-size-and-line-height { font: normal small-caps 120%/120% fantasy }
.bad-order { font: italic bold large "Palatino", serif }

.ascii {
    font-family: "Arial";
}
.lowercase {
    font-family: "arial";
}
.unicode {
    font-family: "楷体";
}
.unicode-escape {
    font-family: "\4EFF\5B8B";
}
.generic {
    font-family: "Arial", "楷体", serif;
}
.blankspace {
    font-family: "Tohama", "Microsoft Yahei", sans-serif;
}
.all-in-one {
    font-family: "Arial", "\9ed1\4f53", "黑体", "华文细黑", sans-serif;
}
.good {
    font-family: "Arial", "\9ed1\4f53", "黑体", "华文细黑", sans-serif;
}

Usage

postcss([ require('postcss-font-normalize') ])

See PostCSS docs for examples for your environment.