# SLDS purpose, principles and building blocks

*Platform User Experience Designer Study Guide · Salesforce Lightning Design System (SLDS) · Last updated October 16, 2026 · https://www.certifyforce.com/study-guide/user-experience-designer/salesforce-lightning-design-system-slds/slds-purpose-principles-and-building-blocks*

What the Salesforce Lightning Design System is and why teams use it: an implementation-agnostic, open-source design system built from design tokens, utilities, guidelines and component blueprints, implemented by Lightning base components, guided by four design principles and supported by ambassadors, voice and tone, accessibility guidance and design tools.

- Certification: Salesforce Platform User Experience Designer
- Exam section: Salesforce Lightning Design System (SLDS)
- Study guide: https://www.certifyforce.com/study-guide/user-experience-designer

**Official exam objective:**

> Describe SLDS and its purpose.

## What the exam expects

- Describe what SLDS provides and why it is implementation-agnostic and open source.
- Name the four fundamental elements of SLDS 1 and tell design tokens, utilities, guidelines and blueprints apart from Lightning base components.
- Match a design decision to the principle it applies: Clarity, Efficiency, Consistency or Beauty.
- Explain systems design ideas at concept level: scalability, affordance, and pattern versus component.
- Make the case for SLDS (benefits, governance roles, voice and tone, accessibility, tools) while knowing it is optional.

Key terms: **design token** (a named entity that stores a visual design attribute, used instead of hard-coded values); **component blueprint** (framework-agnostic, accessible HTML and CSS for a UI element, with no logic); **utility** (a CSS class for a single-use situation, such as the grid); **Lightning base component** (Salesforce's functional implementation of a blueprint); **pattern** (a reusable, documented solution to a common user task built from components).

## Key facts

| Fact | Detail | Source |
|---|---|---|
| SLDS 1 fundamentals | Design tokens, utilities, guidelines, component blueprints | [Get Started with SLDS](https://trailhead.salesforce.com/content/learn/modules/lightning-design-system-development-for-designers/get-started-with-slds) |
| Implementation-agnostic | Works with LWC, Aura, Visualforce, React | [Get Started with SLDS](https://trailhead.salesforce.com/content/learn/modules/lightning-design-system-development-for-designers/get-started-with-slds) |
| Blueprints | Static HTML and CSS; add JavaScript for interaction | [Explore SLDS Resources](https://trailhead.salesforce.com/content/learn/modules/lightning-design-system-basics/explore-slds-resources) |
| Brandable tokens | BRAND prefix; change when an org applies theming | [Design Tokens (SLDS 1)](https://v1.lightningdesignsystem.com/design-tokens/) |
| Design principles | Clarity, Efficiency, Consistency, Beauty | [Design Guidelines (SLDS 1)](https://v1.lightningdesignsystem.com/guidelines/overview/) |
| Using SLDS | Optional; user needs come first | [Become an Advocate for SLDS](https://trailhead.salesforce.com/content/learn/modules/lightning-design-system-basics/become-an-advocate-for-slds) |
| Accessibility target | WCAG AA | [Accessibility Overview (SLDS 1)](https://v1.lightningdesignsystem.com/accessibility/overview/) |
| Mockup tool | SLDS UI Kit in Figma | [Tools Overview (SLDS 1)](https://v1.lightningdesignsystem.com/tools/overview/) |
| SLDS in LEX components | No import or static resource needed | [Style Components with Lightning Design System](https://developer.salesforce.com/docs/platform/lwc/guide/create-components-css-slds.html) |

## Check yourself

- Why does a hand-copied Lightning stylesheet age badly?
- When should a designer build from a blueprint rather than drop in a base component?
- What makes a design token "brandable"?
- Why is a multi-step form a pattern rather than a component?

## Sources

- [Get Started with SLDS](https://trailhead.salesforce.com/content/learn/modules/lightning-design-system-development-for-designers/get-started-with-slds)
- [Learn About Design Systems](https://trailhead.salesforce.com/content/learn/modules/lightning-design-system-basics/learn-about-design-systems)
- [Explore SLDS Resources](https://trailhead.salesforce.com/content/learn/modules/lightning-design-system-basics/explore-slds-resources)
- [Become an Advocate for SLDS](https://trailhead.salesforce.com/content/learn/modules/lightning-design-system-basics/become-an-advocate-for-slds)
- [Design Guidelines (SLDS 1)](https://v1.lightningdesignsystem.com/guidelines/overview/)
- [Design Tokens (SLDS 1)](https://v1.lightningdesignsystem.com/design-tokens/)
- [Blueprint Overview (SLDS 1)](https://v1.lightningdesignsystem.com/components/overview/)
- [Getting Started (SLDS 1)](https://v1.lightningdesignsystem.com/getting-started/)
- [Voice and Tone (SLDS 1)](https://v1.lightningdesignsystem.com/guidelines/voice-and-tone/)
- [Tools Overview (SLDS 1)](https://v1.lightningdesignsystem.com/tools/overview/)
- [Accessibility Overview (SLDS 1)](https://v1.lightningdesignsystem.com/accessibility/overview/)
- [Style Components with Lightning Design System](https://developer.salesforce.com/docs/platform/lwc/guide/create-components-css-slds.html)
- [Get Started with Systems Design](https://trailhead.salesforce.com/content/learn/modules/systems-design-with-slds/get-started-with-systems-design)
- [Apply Systems Design Principles](https://trailhead.salesforce.com/content/learn/modules/systems-design-with-slds/apply-systems-design-principles)
- [Salesforce Cosmos Theme and SLDS 2 Availability](https://help.salesforce.com/s/articleView?language=en_US&id=xcloud.customize_ui_enhancedlex.htm&type=5)
- [Style Components Using SLDS Styling Hooks](https://developer.salesforce.com/docs/platform/lwc/guide/create-components-css-custom-properties.html)

## About the full unit

The "Core concepts", "Exam traps" and "Worked scenario" sections of this unit, its 18 linked practice questions, and unlimited timed mock exams are included with the Platform User Experience Designer pack (USD $19): https://www.certifyforce.com/practice-exams