The fourth episode of this series looks into how you can bring your custom branding to LWR sites, your custom Lightning web components, as well as base Lightning components.
Resources
Sample app: AZ insurance (https://github.com/trailheadapps/az-insurance)
Documentation: Style your LWR site (https://developer.salesforce.com/docs/atlas.en-us.exp_cloud_lwr.meta/exp_cloud_lwr/advanced_custom_style.htm)
Documentation: Lightning Design System Styling Hooks (https://www.lightningdesignsystem.com/platforms/lightning/styling-hooks/)
Documentation: WCAG AA Contrast Ratio (https://www.w3.org/TR/WCAG/#contrast-minimum)
Tool: Contrast Ratio Validator (https://webaim.org/resources/contrastchecker/)
0:00 Introduction
0:22 Custom styling overview
1:18 Custom CSS properties explained
3:28 How to customize an LWR site theme visually
4:28 Use static resources for global CSS properties
5:24 Programmatic use of CSS properties
6:50 CSS fallback properties and contrast ratio
Connect with Salesforce Developers:
Website: https://www.developer.salesforce.com/
Facebook: https://www.facebook.com/salesforcedevs/
Twitter: https://www.twitter.com/salesforcedevs
LinkedIn: https://www.linkedin.com/showcase/salesforce-developers