PostCSS Font Weight Names

PostCSS plugin to convert commonly used font-weight names i.e. Thin, Semi Bold, Heavy, etc.. to a numeric font-weight

Installation

npm install postcss-font-weight-names

Before

.font-weight {
  font-weight: Semi Bold;
}

After

.font-weight {
  font-weight: 600;
}

Font weight name mappings

Name	Weight
Thin, Hairline	100
Extra Light, Ultra Light	200
Light	300
Normal, Regular	400
Medium	500
Semi Bold, Demi Bold	600
Bold	700
Extra Bold, Ultra Bold	800
Black, Heavy	900

You can use any of the following ways to write the names: Semi Bold, semi bold, semi-bold, semi_bold.

Usage

postcss([ require('postcss-font-weight-names') ])

See PostCSS docs for examples for your environment.