The font swatch contains a font family for each of the fonts you will be using for your website. A font family consists of the backup fonts that the browser will display in case your primary font can't be rendered. For each of the main fonts you plan on using in your website, you should find one or two more fonts of the same style as the secondary and tertiary fonts in the family.
To generate a font swatch, you should add a font family for every main font you plan on using and input the secondary and tertiary fonts for each, then click the button to generate.