What else? Brand contrast, brand dark, brand header, brand header contrast. And it tells you what it's for dark variant of brand that is accessible with white. So this color is called brand accessible. Number one, they have meaningful names, they're very descriptive.
Now there are two things I want you to notice about these tokens. So, instead of using these hard coded values, they're using tokens because in the future, instead of changing one value in 20 different places, all they have to do is change this value in one place. If we go to spacing we can find spacing large, spacing medium, spacing none. It has a short description, it gives you an example, and you can see its properties here. And if we go to font size, we can see that a token is for example, font size 1. They're categorized right here on the right, under colors, background color, text color, fonts opacity, and so on, and so forth. Now, if we open that system, we can take a look at the design tokens they're using. We use them in place of hard-coded values in order to maintain a scalable and consistent visual system for UI development. Specifically, they are named entities that store visual design attributes. It says design tokens are the visual design atoms of the design system. Actually, the lighting design system by Salesforce, gives us a great definition for these design tokens. Design tokens are elements we use to store design-related variables, for example, a color value, a font family or the value for an animation or a shadow. But before that, there are two concepts you need to be aware of, Design Tokens and Design Principles. In this chapter, you'll learn about the first steps you need to take to create a Design System.
0 kommentar(er)
