example for using Shoelaces Typography

[chuongtang]

Hi all, I am exploring some cool features from Shoelaces and can't get the typography classes to work. Does anyone have an example?

Here is my attempt :<p sl-font-weight-bold sl-color-orange-500> some texts here..</p>

[claviska]

The design tokens are CSS custom properties, not classes. You're probably looking for #413, but that's still on the roadmap. In the meantime, you can map design tokens to tags/classes yourself:

h1 {
  font-family: var(--sl-font-sans);
  font-weight: var(--sl-font-weight-bold);
  color: var(--sl-color-orange-500);
}

[chuongtang]

Thank-you! I should have spent time and read the doc properly.