Each font family in a kit has one or more CSS names assigned to it. These are the names that you use in font-family declarations within your own CSS in order to use the fonts on your page.
CSS names can change from kit to kit
It's important to note that the same font family can have different names in different kits. This is why it's a best practice to always get the CSS font-family names to use from the API instead of guessing or inferring them from another piece of information, like the name or the slug.
You can find the appropriate CSS names to use for the font families in a kit by making a GET request to kits/:kit/published. Either use all the values of the css_names property to build your own font-family stack, or use the css_stack property, which already contains the user-selected fallback fonts and is properly quoted and ready to be used as a font-family value.
Segmented vs. unsegmented CSS names
Older kits used a method of font protection that involved splitting a single font file in half, with half of the characters in one file and the other half in a different file. We've since found better means of protecting fonts, but the old style segmented names (e.g. droid-sans-1 and droid-sans-2) have persisted. We never change the style of font-family names in an existing kit because that would require changing all the CSS associated with that kit.
However, when creating new kits, you can choose the style of CSS names that the kit should use for all font families in the kit. Just include the segmented_css_names parameter when making a POST request to kits. The options are:
true- Use segmented names (e.g.droid-sans-1anddroid-sans-2)false- Use a single unsegmented name (e.g.droid-sans)
The default for segmented_css_names when using the API is true to maintain backwards compatibility for applications that expect segmented CSS names for newly created kits.