Lightning Aura Components Developer Guide

Introducing Aura Components
Quick Start
Creating Components
Using Components
Communicating with Events
Communicating Across the DOM with Lightning Message Service
Creating Apps
Styling Apps
Using the Salesforce Lightning Design System in Apps
Using External CSS
More Readable Styling Markup with the join Expression
Tips for CSS in Components
CSS for RTL Languages
Vendor Prefixes
Styling with Design Tokens and Styling Hooks
Tokens Bundles
Create a Tokens Bundle
Defining and Using Tokens
Using Expressions in Tokens
Extending Tokens Bundles
Using Standard Design Tokens
Replace Design Tokens with Styling Hooks
Developing Secure Code
Using JavaScript
Working with Salesforce Data
Testing Components
Debugging
Performance
Reference
PDF

Note: This release is in preview. Features described here don’t become generally available until the latest general availability date that Salesforce announces for this release. Before then, and where features are noted as beta, pilot, or developer preview, we can’t guarantee general availability within any particular time frame or at all. Make your purchase decisions only on the basis of generally available products and features.

Create a Tokens Bundle

Create a tokens bundle in your org using the Developer Console.

Salesforce recommends that you use Styling Hooks instead of design tokens if possible. While existing design tokens still work, styling hooks are the future of customization for Lightning web components and Aura components. See Replace Design Tokens with Styling Hooks.

Important

To create a tokens bundle:

  1. In the Developer Console, select File | New | Lightning Tokens.
  2. Enter a name for the tokens bundle.
    Your first tokens bundle should be named defaultTokens. The tokens defined within defaultTokens are automatically accessible in your Lightning components. Tokens defined in any other bundle won’t be accessible in your components unless you import them into the defaultTokens bundle.
You have an empty tokens bundle, ready to edit.
1<aura:tokens>
2
3</aura:tokens>

You can’t edit the tokens bundle name or description in the Developer Console after you create it. The bundle’s AuraBundleDefinition can be modified using the Metadata API. Although you can set a version on a tokens bundle, doing so has no effect.

Note