Gen Interface JP

Gen Interface JP is a Japanese/Latin UI typeface built from Inter and Noto Sans JP. This package contains unicode-range WOFF2 subsets for web use.

Which CSS Should I Use?

Use the cdn/*.css files when linking directly from jsDelivr:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/cdn/400.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/cdn/display-800.css">

The CDN CSS files contain absolute WOFF2 URLs such as:

src: url("https://cdn.jsdelivr.net/npm/[email protected]/w/normal/400/000.woff2") format("woff2");

Use the plain .css files when installing from npm or self-hosting:

import "gen-interface-jp/400.css";
import "gen-interface-jp/display-800.css";

Plain CSS files keep relative WOFF2 URLs:

src: url("./w/normal/400/000.woff2") format("woff2");

That relative form is correct for browsers and lets bundlers, local servers, and self-hosted deployments keep the CSS and w/ directory together without depending on jsDelivr.

Entry Points

• all.css: self-host all weights and both families.

• 100.css ... 800.css: self-host Gen Interface JP.

• display-100.css ... display-800.css: self-host Gen Interface JP Display.

• cdn/all.css: jsDelivr all weights and both families.

• cdn/100.css ... cdn/800.css: jsDelivr Gen Interface JP.

• cdn/display-100.css ... cdn/display-800.css: jsDelivr Gen Interface JP Display.

Font Families

body {
  font-family: "Gen Interface JP", sans-serif;
}

h1 {
  font-family: "Gen Interface JP Display", sans-serif;
}

License

Generated fonts are licensed under the SIL Open Font License 1.1. See OFL.txt.