Typographie
Figtree pour l'interface, Cutta pour les titres marketing, sur une échelle de dix tailles dont chacune arrive avec son interlignage apparié.
Échelle
Dix tailles, de 10 à 64 px, dont la plus grande ne sert qu'aux titres marketing. L'interlignage est apparié à la taille : les deux se prennent ensemble, jamais l'un sans l'autre.
Graisses
Cinq graisses de Figtree, rendues à taille de lecture. Une graisse ne se juge pas sur un titre de 48 px.
Titres marketing
Les sept styles Heading-mkg, en Cutta Bold, de 64 à 16 px, sur les tailles et les interlignages de l'échelle.
Accessibilité
Les tailles et les interlignages sont émis en rem (base 16 : 1rem vaut 16 px) : le réglage de taille de police du navigateur les agrandit, ce qu'il ne ferait pas de tailles en px. À taille normale, rien ne change. Les boîtes de texte du kit (boutons, champs, onglets, entrées de navigation) ont une hauteur minimale, pas une hauteur fixe : elles grandissent avec le texte. Un libellé qui informe passe à la ligne plutôt que d'être tronqué ; seuls les montants, les badges, les chips et les libellés d'axe restent sur une ligne.
Icônes
135 glyphes mono, rendus par masque CSS pour hériter de la couleur du texte, et 60 pictos DuoTone qui lisent leurs tokens. La bibliothèque complète se parcourt sur la galerie d'assets.
Button
L'action principale d'un écran. Un seul bouton rempli par vue, les autres actions passent en outlined ou ghost.