Arizona Individuals

Five separate Variable Fonts that allow for modulating the weight and italic output within each subfamily.

IN USE Example

In case you missed our Using Variable Fonts on the Web tutorial, here's how you embed a variable font alongside the settings it takes go generate the visual output you want.

@font-face {
  font-family: "Arizona Flare Variable";
  src: url("/fonts/ArizonaFlareVariable.woff2") format("woff2-variations"),
       url("/fonts/ArizonaFlareVariable.woff") format("woff-variations");
}

Then, control the axis values using font-variation-settings

h1 {
  font-family: "Arizona Flare Variable";
  font-variation-settings: "wght" 400, "ital" 10;
}

With the setting above, you’ll get an output that is regular (400) in weight, and with a slight 10° Italic angle. Like below:

What are VFs again?

A variable font is a special type of font file that contains multiple fonts within it. These “internal fonts” can either be accessed seamlessly along defined variations axes or as predefined instances or states. The axes allow us to navigate through a typeface’s design space, rather than being restricted to its defined poles. Essentially, this technology enables static fonts to become dynamic and shift their appearance.

Arizona Facts

• Consists of five distinct yet connected subfamilies:
  Serif, Text, Mix, Flare, and Sans
• Each subfamily comes with
  Thin, Light, Regular, Medium & Bold weights and Italics
• 10 Styles per family, 50 styles in total

Available Packages

• Arizona Plus: all five families packaged into one big font Variable Font. This allows the user to slide from sans to serif, via the serif axis, and modulate its exact weight and italic angle
• Arizona Individual: five separate Variable Fonts. This allows the user to modulate weight and italic within each family’s design space