Dark mode is so hot right now. This article goes in depth into how dark mode works on Android, iOS, and the web as well as tips on how to structure your design tokens and 2 different implementations of dark mode in Style Dictionary.
The web is the default language of design systems right now. Any discussion about design systems is assumed to be talking about the web. And I get it. I love the web. The web is an amazing medium, but it is not the only way our customers interact with our products. A lot of the products we work on are not just web applications. As a community I want us to break outside web centric mindset and take a more holistic view to include all the ways we can help deliver experiences to our customers. Let's explore some the ways we can incorporate other platforms into our design systems.
In this article I will show you how to build a Visual Studio Code color theme extension using Style Dictionary. Throughout the process I will try to explain concepts about VSCode theme development so you can apply them when you are creating a theme even if you don't use Style Dictionary.
All work done on the design system should follow the same processes and mechanisms, regardless of who does it. Treating everyone equally, as a contributor, forces your design system to have very clear and stable contribution mechanisms and documentation.
In this article I will show you all the cool things people are doing to document design tokens. Hopefully, you will learn something new you can take back to your design system. Before we get started, a few quick notes.
Thinking about the scenario and the semantics of the component before doing any design or development work is important to get right from the start. The component name and API is a contract to the user, that this component will do what it says.