Salesforce · Design system breakdown
The deepest enterprise CRM design system in public view.
Salesforce introduced the Lightning Design System (SLDS) alongside Lightning Experience around 2015 to replace earlier Salesforce Classic UI. It is the design language behind Sales Cloud, Service Cloud, and the broader Lightning platform.
Salesforce design and platform teams own the canonical system. Component implementations are tied to the Lightning platform; web-only consumers can adopt the CSS framework.
| Token | Value | Role |
|---|---|---|
| color-background | #f3f3f3 | Page background |
| color-text-default | #181818 | Default text |
| color-brand | #1b96ff | Salesforce primary |
| spacing-medium | 1rem (16px) | Default spacing step |
| duration-quickly | 100ms | Micro-interaction |
| border-radius-medium | 0.25rem | Default radius |
Token names and values are illustrative — refer to the system's official tokens reference for the canonical, current set.
If you're evaluating this system
Pick SLDS if you're building on the Salesforce platform or specifically need a reference for dense, data-driven enterprise UI. As a generic system, the coupling to Lightning runtime is a hurdle.
Compare more systems