Typography Styles
Define reusable typography styles for use across your site
Typography design tokens enable you to load in reusable typography styles for use across your site. This enables you to create consistency and a comprehensive design system for users to build on brand sections and templates.
If you are designing for Nyla, we suggest to review best practices for designing typography for Nyla in addition to reading this article.
Settings
Preview
Preview the style as you change settings.
Design
Add design settings
- Title: name your typography style
- Description: Add a description for easy reference
- Font: Choose from Fonts
- Font size: Responsive
- Letter spacing: Responsive
- Line height: Responsive
- Paragraph spacing: Responsive
- Text transform: Choose the text case
-
- None
- Uppercase
- Lowercase
- Capitalize
Strikethrough style
Set a custom strikethrough style
- Color
- Offset
- Thickness
- Position
Stroke
Add a custom stroke style
- Color
- Width
Shadow
Add a custom shadow
- Shadow
- Color
In use
Typography styles are used throughout Nyla and help maintain consistent type styles.