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 bit.ly/3jBSLuX or LinkedIn 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

[@DmitriGoncharov]

Your videos, sir, by far my favorite on the channel! Please keep posting them!

[@poskryakov]

Thanks, Aditya! That video is helpful for me in a lot of ways.

[@venkatreddy-qt8ow]

Hi Aditya firstly I would like to thank for the video on slds class Secondly plz provide online training coz it's became hard to find mentores who teach like u it helps a lot of people like me Thanking you plz consider my request and i will be the first student to be ur student if u start training students

[@colandru]

Great overview! thanks for sharing this

[@ashu15531]

Very much informative... Thanks Aditya

[@pawelwoz]

Could you please provide 720p version? It is hard to read small text with 480p.

[@SalesforceDevs]

We'll look into this and see if we have it available. We'll also make sure future videos are more clear and have bigger fonts!

[@anassnebdaoui2570]

Awesome 😄😄 Thanks

[@tyrant_hermit]

Awesome as always. Can't wait to try the trailmix.

[@ezpz4akash]

+1

[@shubhambajare3043]

Why some videos are in 480p??

[@shivavance9783]

This was great 😃

[@nayanmore1615]

Being Styling hooks are in Beta version so do you recommended not to use it ?

[@SalesforceUSA]

Buddy you have to use a different chair , your image is visible with rhe awakward chair.