3 ms·
> you typically want these to not be affected by styling on the page, and if you do want them to be styled, you only want them to be styled in specific ways whi
by gedy 3y ago
> you typically want these to not be affected by styling on the page, and if you do want them to be styled, you only want them to be styled in specific ways which you can build in via css custom property values
Ironically, this proves my point about opinions a bit - our design system is themeable and needs to cover a number of technologies and we want to inherit the app's CSS, not embed the styles or have to specify colors on every component.
- jjcm 3y agoThere's a strong difference between styles and themes. Theming is quite easy with web components, as long as you have a semantic layer to your design tokens. Since custom properties do cascade, it's quite easy to automatically switch themes while still preventing css-selector clobber issues with styles. If you're curious on this approach, my site non.io has light/dark theming via this method, and Figma's light/dark mode was loosely based on this approach.