function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Nadia Gainsbourg 17Nadia Gainsbourg 17 

How to Reference Standard Design Tokens

I'm new to Lightning Design System and am trying to find concrete examples of how to apply standard design tokens from this guide: https://www.lightningdesignsystem.com/design-tokens/#category-font-size

I have a Lightning Component, but it's unclear how to reference them. 

Would appreciate any help! 
Nadia Gainsbourg 17Nadia Gainsbourg 17
I've tried referencing it like this: 

.THIS {
    font-size:token($font-size-10);
}

It doesn't work. It says there's no such token. I don't get it, because this token is taken directly from the official guide. 
Sanjay Bhati 95Sanjay Bhati 95
Hi Nadia

Here is the steps to use token first time
1. First you have to create a tokon with the name of 'DefaultTokens' 
2. Second create the token in your default tokens like 
   DefaultTokens.tokens 
<aura:tokens>
<aura:token name="fontsize" value="`10"/> 
</aura:tokens>

3. Now use the token in your component 
     
font-family: token(font-size);
Please test and let me know
Thanks ​​​​​​​