SLDS Deep Dive and Best Practices

SLDS is a platform-agnostic design system that can be used to create the world's best enterprise app experiences. Join this session to learn about the key principles behind SLDS and how you can rapidly use it to prototype user interfaces. You'll learn how to use SLDS in Visualforce pages, Aura and Lightning Web Components, and even outside Salesforce. We'll dive deep into concepts like CSS Tokens, Styling Hooks, customizing base components, and best practices for using SLDS Validator.

Follow Aditya Naag Topalli on Twitter https://bit.ly/3jBSLuX or LinkedIn https://bit.ly/3jBSNTB

00:00:00 Intro
00:01:06 About SLDS
00:05:10 The SLDS Stack
00:12:56 Prototyping using Sketch
00:19:50 Where can you use SLDS
00:21:06 Using SLDS in Visualforce
00:22:51 Using SLDS outside LEX
00:25:45 Using SLDS outside Salesforce
00:27:30 The SLDS CSS Bundle
00:34:02 SLDS Grid System
00:38:12 Design Tokens
00:41:31 CSS Custom Properties
00:47:48 Styling Hooks
00:54:04 Density Settings
00:55:48 SLDS Validator