![]() These all control the core styling of your components and help keep them organized based on their context and usage. You can apply the same naming convention principles to all the various design foundation types, like typography, spacing, elevation, and corner radius. If we break that down, then your alias naming convention might follow a token scheme that looks something like this: A token scheme is a naming convention based on usages, like a button, a form, or a card. You should organize your design tokens with a structured naming convention based on context and usage, which as a reference is called a token scheme. ![]() You start with a global design token that holds your primary value, which can later be inherited down to various alias tokens that represent the styling of a component.Ī well-organized design foundation increases design automation and makes it easier to make the handoff between design and development, as engineers can quickly translate your design system foundation into code.ĭesign tokens force consistency in design, as each individual design element is connected to a style and therefore a design token, which enables scalability and productivity. You can easily apply the same design token principles used in a front-end framework to your design system. Create better designer-to-developer handoffs This improves scalability and performance in a front-end framework, and it is also a great way to build your design system around the same principles. This single token is later inherited down to alias tokens that represent a specific context or abstraction in a design. All design foundations start with a global design token and a value. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |