Accoutrement-Type
Sass typography and webfont helpers by OddBird. Gather all your fonts into a single map, access them by name, and easily import the webfonts. Also includes helpers for accessibility and pseudo-elements.
More Accoutrement Tools
- Init provides light-weight browser-normalization.
- Color provides color-palette management and contrast-ratio utilities.
- Scale helps manage scale patterns like font-sizes, margins, and gutters.
- Layout provides layout utilities such as box-sizing, intrinsic ratios, z-index management, named media-queries, and a clearfix.
Quick Start
Install the package with npm or yarn:
npm install accoutrement-typeyarn add accoutrement-type
Import the library:
;
Configure your font settings:
// Define what webfont formats need importing ; // Set the a path to your fonts directory ; ;
Import one font at a time with font-face()
or all your local webfonts with import-webfonts()
:
// Import one font by configuration key, with custom formats // Import all local fonts
Set your font-family anywhere, using the semantic names you defined earlier:
html h1, h2, h3