Text sizes are defined by a modular scale. This variable is used for any measurement on the vertical axis in the page, including the leader and trailer grid helper classes and padding for components like buttons which use standard measurements like 3/$baseline and 2/$baseline. $baseline sets a standard and regular leading in relation to the body copy – 1.5rem. Vertical rhythm is maintained in the Calcite Web Type System by the use of the $baseline variable.

Note: due to license restrictions these files can only be made available for Esri product teams. Use Behind a Firewallįonts in Calcite Web are loaded from the Esri CDN, but if you are working on an Esri product that will be deployed behind a firewall, you can also host the files yourself, locally.įor more instructions on setting up locally-hosted fonts, view the Calcite Fonts project. To learn more about internationalization and to see all of the languages that Calcite Web supports, check out the i18n example page. This is accomplished by using the unicode-range property in the declaration. Non-latin character sets are pulled in only when needed, so if your application is in English, the browser will only load the files it needs for displaying English. For each of these languages, Calcite Web will load a font that maintains a similar look and feel. Some languages, however, use characters that aren't included in Avenir Next. In most latin-based languages, everything can be rendered in Avenir Next. InternationalizationĪlmost every major language is styled for you, automatically. To find out if you can use these fonts, please check 2.2 section C of Esri's master agreement. However, if you are a developer outside Esri, you may not have a license to use these fonts.

LicensingĬalcite Web provides Esri's fonts automatically as part of the framework. All font-weights and faces can be set either with helper classes or Sass mixins. Calcite Web primarily uses Avenir Next, but also provides a system monospace stack.

Avenir next bold github download