Chakra Petch Type The type element displays the alternative Chakra Petch font family.
Important Notes: The font family of a type element can be adjusted by adding the prop font_family: 'chakrapetch' or the class e-bolt-type--chakrapetch The Chakra Petch font does not support Extra Bold (font-weight: 800) font weight
Demo

Chakra Petch/Open Sans Comparison.

This is a type headline with the Open Sans.

This is a type headline with the Chakra Petch.

Chakra Petch Weights and Styles.

This Chakra Petch font is bold.

This Chakra Petch font is bold and italicized.

This Chakra Petch font is semibold.

This Chakra Petch font is semibold and italicized.

This Chakra Petch font is medium.

This Chakra Petch font is medium and italicized.

This Chakra Petch font is regular.

This Chakra Petch font is regular and italicized.

This Chakra Petch font is light.

This Chakra Petch font is light and italicized.
Twig
{% include '@bolt-elements-type/type.twig' with {
  content: 'This is a type element with the Chakra Petch font family.',
  font_family: 'chakrapetch',
} only %}
HTML
<p class="e-bolt-type e-bolt-type--chakrapetch">This is a type element with the Chakra Petch font family.</p>