---
schema_version: "1"
id: fcecebe094321835c4f59dc8e8d746395cd530f598c910918bf36500e2332008
title: Using the Salesforce Lightning Design System in Apps
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/aura-platform/guides/aura/apps/apps-slds.md
canonical_url: https://developer.salesforce.com/docs/platform/aura-platform/guide/apps-slds.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: 4090078081b63c2a2d8b4e1397c0f5536701f944068532712131fb3441e4b5a4
products:
  - Lightning Aura Components Developer Guide
  - Platform Developer Content
---

# Using the Salesforce Lightning Design System in Apps

The Salesforce Lightning Design System (SLDS) provides a look and feel that’s consistent with Lightning Experience. Use Lightning Design System styles to give your custom stand-alone Lightning applications a UI that is consistent with Salesforce, without having to reverse-engineer our styles.

Your application automatically gets Lightning Design System styles and design tokens if it extends `force:slds`. This method is the easiest way to stay up to date and consistent with Lightning Design System enhancements.

To extend `force:slds`:

```nolang
<aura:application extends="force:slds">
    <!-- customize your application here -->
</aura:application>
```

## Using a Static Resource

When you extend `force:slds`, the version of Lightning Design System styles is automatically updated whenever the CSS changes. If you want to use a specific Lightning Design System version, download the version and add it to your org as a static resource.

**note:** We recommend extending `force:slds` instead so that you automatically get the latest Lightning Design System styles. If you stick to a specific Lightning Design System version, your app’s styles will gradually start to drift from later versions in Lightning Experience or incur the cost of duplicate CSS downloads.

To download a version of Lightning Design System that doesn’t exceed the maximum size for a static resource, go to the Lightning Design System [downloads page](https://www.lightningdesignsystem.com/resources/downloads/).

Salesforce recommends that you name the Lightning Design System archive static resource using the name format SLDS_###_, where _###_ is the Lightning Design System version number (for example, `SLDS252`). This lets you have multiple versions of the Lightning Design System installed, and manage version usage in your components.

To use the static version of the Lightning Design System in a component, include it using `<ltng:require/>`. For example:

```nolang
<aura:component>
    <ltng:require 
        styles="{!$Resource.SLDS252 +
            '/styles/salesforce-lightning-design-system.min.css'}" />
</aura:component>
```

**See Also**  


-   [Styling with Design Tokens and Styling Hooks](https://developer.salesforce.com/docs/platform/aura-platform/tokens/tokens-intro.md)