Katagamiv0.1

Variable fonts

A variable font stores a design's extremes in one file and lets the renderer draw any point between them.

How Katagami uses it

Each Katagami member is one variable TrueType file with a weight axis called wght. The axis runs from 100 to 900 in four members and from 100 to 700 in Katagami Mono. The build draws three masters named Thin, Regular and Black. All three have the same points in the same order, and the font interpolates between them.

Thin 100 · Regular 400 · Black 900

Named styles

The files also name their styles. Katagami Sans, Round, Text and Serif name nine styles, which are Thin, ExtraLight, Light, Regular, Medium, SemiBold, Bold, ExtraBold and Black. Katagami Mono names the seven from Thin to Bold. Apps that do not handle variable fonts list the named styles as separate styles.

Weights in CSS

CSS can set any weight on the axis, such as 650.

.title { font-family: "Katagami Sans"; font-weight: 650; }

A transition on font-weight animates the weight. The footer of this site uses one.