Estoy hablando de un marco de color pequeño que se utiliza en nuestro DS. Primero, como de costumbre, un pequeño repaso de las mejores prácticas, y luego mi bicicleta. Vayamos en orden.
Cuantas flores necesitas
Nuestros "Clientes" de colores son diseñadores de productos, marketing y desarrollo.
¿Qué necesita un simple diseñador para ser feliz?

¿Qué necesita un marketing?

¿Qué necesita el desarrollo?

De acuerdo, ¿cuántos tonos de cada color necesitas? Por cierto, no es la pregunta más fácil.
Método 1
Para hacerlo una vez y eso es suficiente, generalmente hacen esto:

/ - ( ), . - , .
- , — :

2
, , . .
— , 49 , , , , , , , .
, :
—
, , , ?
,
- . , , . - .
3
. Default, hover, pressed, .. . , , — - .
-
Color name / Default
Color name / Hover
Color name / Disabled
. .
. , . , , - .
2 :
— . .
Base — ;
BG — ;
Functional — .
— . .
Brand — , ;
Promo — -.
, -, . . , .
. — , — , - . , .
.

.

, , .

.

- - , : , . .

, . , , , .
— .
, , .

, , . , .

, - . , , - . , , , . "" .
, , . "" .

, " ", . , .
:
/ / _ / Tea / Solid / Base / Primary_Inverted / Default Sugar / Gradient / Brand / Secondary / Up
Existe la opiniĂłn de que los tokens deberĂan tener el mismo nombre en figma y en el cĂłdigo. Pero no todo es tan sencillo. Los patrones de color en figma y diseño son diferentes. Al hacer todo igual, doblaremos al diseñador y obtendremos curvas del grupo de colores en Figma con las que le resultará difĂcil trabajar. Por lo tanto, para los colores, vale la pena describir la convenciĂłn de nomenclatura, que describirá los principios mediante los cuales se nombran los colores en figma y cĂłmo se debe transferir esta nomenclatura al cĂłdigo. Como resultado, todos deberĂan estar bien.
La idea con los cambios se espiĂł en el esquema de color Opium.Fill .