https://github.com/percolate/neue
A minimal web font loader
https://github.com/percolate/neue
Last synced: over 1 year ago
JSON representation
A minimal web font loader
- Host: GitHub
- URL: https://github.com/percolate/neue
- Owner: percolate
- License: mit
- Created: 2013-09-20T18:58:33.000Z (almost 13 years ago)
- Default Branch: master
- Last Pushed: 2023-03-16T18:01:45.000Z (over 3 years ago)
- Last Synced: 2025-03-29T06:23:12.956Z (over 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 160 KB
- Stars: 7
- Watchers: 71
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# neue
[](https://circleci.com/gh/percolate/neue)
## A minimal web font loader
Async loading of linked fonts with `@font-face`.
## Installation
Install with npm:
```
$ npm install neue
```
## Downloads
- [neue.js](dist/neue.js)
- [neue.min.js](dist/neue.min.js)
## Usage
Load font families using [FVD-style](https://github.com/percolate/fvd) declarations:
```js
neue.load([
{ families: ['Source Sans Pro:n2,n3,n4,n6,n7,n9'], css: '//fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900' }
], function(err){
// fonts are ready!
})
```
Where the CSS file looks like this:
```css
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 200;
src: ...
}
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 300;
src: ...
}
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 400;
src: ...
}
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 600;
src: ...
}
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 700;
src: ...
}
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 900;
src: ...
}
```
## Utilities
### `parse`
```js
neue.parse('Source Sans Pro:n2') // { family: 'Source Sans Pro', variations: ['n2'] }
```
### `stringify`
```js
neue.stringify('Source Sans Pro:n2') // ['source-sans-pro-n2']
```
## Example
Run the example server at [http://127.0.0.1:3000](http://127.0.0.1:3000):
```
$ npm run example-server
```
## Tests
Run the test server at [http://127.0.0.1:8000](http://127.0.0.1:8000):
```
$ grunt test:dev
```
## Builds
Create standalone `dist/neue.js` and `dist/neue.min.js` builds:
```
$ grunt dist
```
## License
MIT License, see [LICENSE](https://github.com/percolate/neue/blob/master/LICENSE.md) for details.