Skip to content

Latest commit

 

History

History
81 lines (50 loc) · 1.79 KB

README.md

File metadata and controls

81 lines (50 loc) · 1.79 KB

Font utilities

Installation

npm i @superflycss/utilities-fonts

Usage

The root package contains all Google Fonts Utilities. That means all the fonts and all the supporting weights..

Load all fonts utilities like this:

@import '@superflycss/utilities-fonts';
...

Or load them by idividual sub packages.  For example:

``` css
@import '@superflycss/utilities-fonts/google/lato';
...

To use the lato font at normal weight apply the utility like this:

<h1 class="u-font-lato-400">A Font Lato Heading Normal Font Weight (400)</h1>

To use the italic lato font at normal weight apply the utility like this:

<h1 class="u-font-lato-400-italic">A Font Lato Heading Normal Font Weight (400)</h1>

Now run the build with sfc build and postcss font-magician will create the font face rules in the target build file.

Have a look here for all the font face rules the build generates.

Dependency Install

This will install all dependencies including the SuperflyCSS CLI.

npm run i

Clone

git clone [email protected]:superflycss/utilities-fonts.git

Build

npm run b

Publish

npm run p

Related Articles

Snippets

This snippet contains @import statements for all the font utility pakcage. This enables developers to quickly add imports for the fonts of their choosing.