Use Noto!

I use Noto all over the place. I found I was repeating the same conversion + import process on every site. So, I built this project as a way for me to import Noto quickly.

Import the stylesheets of the variants you want into your project:

There are quite a few...
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-100.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-100-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-200.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-200-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-300.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-300-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-400.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-400-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-500.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-500-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-600.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-600-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-700.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-700-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-800.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-800-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-900.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-900-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-greek-100.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-greek-200.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-greek-300.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-greek-400.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-greek-500.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-greek-600.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-greek-700.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-greek-800.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-greek-900.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-hebrew-100.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-hebrew-200.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-hebrew-300.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-hebrew-400.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-hebrew-500.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-hebrew-600.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-hebrew-700.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-hebrew-800.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-hebrew-900.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-mono-100.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-mono-200.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-mono-300.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-mono-400.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-mono-500.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-mono-600.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-mono-700.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-mono-800.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-mono-900.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-100.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-100-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-200.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-200-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-300.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-300-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-400.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-400-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-500.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-500-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-600.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-600-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-700.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-700-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-800.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-800-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-900.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-900-italic.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-greek-100.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-greek-200.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-greek-300.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-greek-400.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-greek-500.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-greek-600.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-greek-700.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-greek-800.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-greek-900.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-hebrew-100.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-hebrew-200.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-hebrew-300.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-hebrew-400.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-hebrew-500.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-hebrew-600.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-hebrew-700.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-hebrew-800.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-hebrew-900.css';

...or you can import everything per family:

@import 'https://use-noto.assertchris.io/stylesheets/noto-sans.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-greek.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-hebrew.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-sans-mono.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-greek.css';
@import 'https://use-noto.assertchris.io/stylesheets/noto-serif-hebrew.css';

Then, use the fonts in your CSS:

blockquote {
font-family: 'Noto Sans';
}
code {
font-family: 'Noto Sans Mono';
}
p {
font-family: 'Noto Serif';
}
.greek-sans {
font-family: 'Noto Sans Greek', 'Noto Sans';
}
.greek-serif {
font-family: 'Noto Serif Greek', 'Noto Serif';
}
.hebrew-sans {
font-family: 'Noto Sans Hebrew', 'Noto Sans';
}
.hebrew-serif {
font-family: 'Noto Serif Hebrew', 'Noto Serif';
}

Samples

There are quite a few...
Sans-100Sans-200Sans-300Sans-400Sans-500Sans-600Sans-700Sans-800Sans-900
Sans-100-italicSans-200-italicSans-300-italicSans-400-italicSans-500-italicSans-600-italicSans-700-italicSans-800-italicSans-900-italic
Sans-διαχωρίζω-100
Sans-διαχωρίζω-200
Sans-διαχωρίζω-300
Sans-διαχωρίζω-400
Sans-διαχωρίζω-500
Sans-διαχωρίζω-600
Sans-διαχωρίζω-700
Sans-διαχωρίζω-800
Sans-διαχωρίζω-900
100-להפריד-Sans
200-להפריד-Sans
300-להפריד-Sans
400-להפריד-Sans
500-להפריד-Sans
600-להפריד-Sans
700-להפריד-Sans
800-להפריד-Sans
900-להפריד-Sans
Sans-Mono-100
Sans-Mono-200
Sans-Mono-300
Sans-Mono-400
Sans-Mono-500
Sans-Mono-600
Sans-Mono-700
Sans-Mono-800
Sans-Mono-900
Serif-100Serif-200Serif-300Serif-400Serif-500Serif-600Serif-700Serif-800Serif-900
Serif-100-italicSerif-200-italicSerif-300-italicSerif-400-italicSerif-500-italicSerif-600-italicSerif-700-italicSerif-800-italicSerif-900-italic
Serif-διαχωρίζω-100
Serif-διαχωρίζω-200
Serif-διαχωρίζω-300
Serif-διαχωρίζω-400
Serif-διαχωρίζω-500
Serif-διαχωρίζω-600
Serif-διαχωρίζω-700
Serif-διαχωρίζω-800
Serif-διαχωρίζω-900
100-להפריד-Serif
200-להפריד-Serif
300-להפריד-Serif
400-להפריד-Serif
500-להפריד-Serif
600-להפריד-Serif
700-להפריד-Serif
800-להפריד-Serif
900-להפריד-Serif
Sans English with serif Greek and Hebrew; διαχωρίζω and להפריד.
Serif English with sans Greek and Hebrew; διαχωρίζω and להפריד.