Color in the design system is an extremely important factor; establishing the right color system helps us manage design projects easily and facilitates future project expansions. Choosing the right primary color for the project is crucial, as the primary color is the "spine" of the design. It not only enhances aesthetics but also determines the experience, emotions, recognition, and even the business effectiveness of the project. Below is an example of how Netflix chooses colors for their design.

After we have selected the primary color for the project, the next step is to design a base swatch to manage the project's color system. This base swatch consists of three main parts: the colors, the names of the colors, and the color codes.

Next, we need to choose the shades of the primary color. Here, I use 9 shades of the primary color: 100, 200, 300, 400, 500, 600, 700, 800, 900. You can also choose more shades depending on your project's needs. Once we have selected the primary/500 color, we need to choose other shades of the primary color by moving the color stops along a parabolic path as shown below.

Next, we need to select the Semantic colors (Success, Info, Warning, Danger) for our design project using the method of moving the color stop as I have guided above. For the neutral color, I use the method of adjusting the brightness of pure black.

Finally, we have completed the color system for the project, which includes essential colors such as: Base (Black, White); Primary; Semantic (Success, Info, Warning, Danger); and Neutral. Additionally, we may have some Secondary colors depending on the project's needs.

The method of establishing the color system for the project that I use is based on my practical experience; you can consider it as a reference method for color selection.