@taiga-ui/design-tokens 0.204.0 → 0.205.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@taiga-ui/design-tokens",
3
- "version": "0.204.0",
3
+ "version": "0.205.0",
4
4
  "description": "Taiga UI palette",
5
5
  "keywords": [
6
6
  "angular",
@@ -0,0 +1,558 @@
1
+ & {
2
+ --tui-background-base: var(--tui-const-black-lighter-13); /* Основной фон приложений. Отличается на iOS, Android и Desktop */
3
+ --tui-background-base-alt: var(--tui-const-black-lighter-13); /* Альтернативный основной фон, в тёмной теме в вебе равен base */
4
+ --tui-background-elevation-1: var(--tui-const-black-lighter-16); /* Фон шторок, модальных экранов и карточек, лежащих на фоне base */
5
+ --tui-background-elevation-2: var(--tui-const-black-lighter-20); /* Фон карточек, лежащих на фоне elevation-1 */
6
+ --tui-background-elevation-3: var(--tui-const-black-lighter-22); /* Фон элементов, возвышающихся над всем остальным контентом. Например, всплывающих подсказок */
7
+ --tui-background-neutral-1: var(--tui-const-white-alpha-10); /* Прозрачные контейнеры с минимальным контрастом на фонах base, elevation и neutral. Второстепенные кнопки, карточки без тени, задизейбленные кнопки и т.д. */
8
+ --tui-background-neutral-1-on-light: var(--tui-const-black-alpha-3); /* Прозрачные контейнеры с минимальным контрастом на светлых цветных фонах. Не меняется при переключении темы */
9
+ --tui-background-neutral-1-on-dark: var(--tui-const-white-alpha-10); /* Прозрачные контейнеры с минимальным контрастом на темных цветных фонах. Не меняется при переключении темы */
10
+ --tui-background-neutral-1-opaque: var(--tui-const-black-lighter-20); /* Непрозрачные контейнеры кнопок закрытия и удаления элементов */
11
+ --tui-background-neutral-1-on-base: var(--tui-const-cool-gray-lighter-18); /* Непрозрачные контейнеры с минимальным контрастом на фоне base, не имеющие тени в светлой теме */
12
+ --tui-background-neutral-1-on-elevation-1: var(--tui-const-cool-gray-lighter-18); /* Непрозрачные контейнеры с минимальным контрастом на фоне elevation-1, не имеющие тени в светлой теме */
13
+ --tui-background-neutral-1-hover: var(--tui-const-white-alpha-15); /* Только для веба. Cостояние элементов c фоном neutral-1 при наведении */
14
+ --tui-background-neutral-1-pressed: var(--tui-const-white-alpha-20); /* Нажатое состояние элементов с фоном neutral-1 */
15
+ --tui-background-neutral-1-hover-on-light: var(--tui-const-black-alpha-6); /* @Deprecated: коррекция названия на neutral-1-on-light-hover */
16
+ --tui-background-neutral-1-hover-on-dark: var(--tui-const-white-alpha-15); /* @Deprecated: коррекция названия на neutral-1-on-dark-hover */
17
+ --tui-background-neutral-1-on-light-hover: var(--tui-const-black-alpha-6); /* Состояние при наведении элементов с фоном neutral-1-on-light, не меняется при переключении темы */
18
+ --tui-background-neutral-1-on-dark-hover: var(--tui-const-white-alpha-15); /* Состояние при наведении элементов с фоном neutral-1-on-dark, не меняется при переключении темы */
19
+ --tui-background-neutral-1-pressed-on-light: var(--tui-const-black-alpha-12); /* @Deprecated: коррекция названия на neutral-1-on-light-pressed */
20
+ --tui-background-neutral-1-pressed-on-dark: var(--tui-const-white-alpha-20); /* @Deprecated: коррекция названия на neutral-1-on-dark-pressed */
21
+ --tui-background-neutral-1-on-light-pressed: var(--tui-const-black-alpha-12); /* Нажатое состояние элементов с фоном neutral-1-on-light, не меняется при переключении темы */
22
+ --tui-background-neutral-1-on-dark-pressed: var(--tui-const-white-alpha-20); /* Нажатое состояние элементов с фоном neutral-1-on-dark, не меняется при смене темы */
23
+ --tui-background-neutral-2: var(--tui-const-white-alpha-15); /* Прозрачные контейнеры маленьких размеров */
24
+ --tui-background-neutral-2-hover: var(--tui-const-white-alpha-20); /* Прозрачные контейнеры со средним контрастом. Нажатое состояние элементов с цветом neutral-2 */
25
+ --tui-background-neutral-2-pressed: var(--tui-const-white-alpha-25); /* Прозрачные контейнеры со средним контрастом. Нажатое состояние элементов с цветом neutral-2 */
26
+ --tui-background-neutral-2-on-light: var(--tui-const-black-alpha-6); /* @Deprecated: Изменен на neutral-1-pressed-on-light */
27
+ --tui-background-neutral-2-on-dark: var(--tui-const-white-alpha-15); /* Прозрачные контейнеры со слабым контрастом на темных цветных фонах, не меняется при смене темы */
28
+ --tui-background-neutral-2-on-dark-hover: var(--tui-const-white-alpha-20); /* Прозрачные контейнеры со слабым контрастом на темных цветных фонах, не меняется при смене темы */
29
+ --tui-background-neutral-2-on-dark-pressed: var(--tui-const-white-alpha-25); /* Прозрачные контейнеры со слабым контрастом на темных цветных фонах, не меняется при смене темы */
30
+ --tui-background-neutral-3: var(--tui-const-white-alpha-20); /* Прозрачные контейнеры со средним контрастом. Нажатое состояние элементов с цветом neutral-2 */
31
+ --tui-background-neutral-3-on-light: var(--tui-const-black-alpha-12); /* Прозрачные контейнеры со средним контрастом на светлых цветных фонах. Нажатое состояние элементов с цветом neutral-2 */
32
+ --tui-background-neutral-3-on-dark: var(--tui-const-white-alpha-20); /* Прозрачные контейнеры со средним контрастом на светлых цветных фонах. Нажатое состояние элементов с цветом neutral-2 */
33
+ --tui-background-neutral-4: var(--tui-const-white-alpha-30); /* Прозрачные контейнеры со средним контрастом. Контейнер аватара с иконкой или текстом */
34
+ --tui-background-neutral-4-on-light: var(--tui-const-cool-gray-alpha-22); /* Прозрачные контейнеры со средним контрастом на светлых цветных фонах. Контейнер аватара с иконкой или текстом. Нажатое состояние элементов с цветом neutral-3 */
35
+ --tui-background-neutral-4-on-dark: var(--tui-const-white-alpha-30); /* @Deprecated: Заменен на overlay-glass-on-dark. Использовался для стеклянных поверхностей */
36
+ --tui-background-neutral-6: var(--tui-const-white-alpha-50); /* Прозрачные контейнеры с сильным контрастом */
37
+ --tui-background-neutral-6-on-light: var(--tui-const-black-alpha-40); /* @Deprecated: Заменен на overlay-glass-on-light. Использовался для стеклянных поверхностей. */
38
+ --tui-background-neutral-6-on-dark: var(--tui-const-white-alpha-50); /* Прозрачные контейнеры с большим контрастом на темных цветных фонах */
39
+ --tui-background-opposite: var(--tui-const-white); /* @Deprecated: Заменен на accent-opposite */
40
+ --tui-background-primary-on-light: var(--tui-const-black); /* @Deprecated: Заменен на accent-on-light */
41
+ --tui-background-primary-on-dark: var(--tui-const-white); /* @Deprecated: Заменен на accent-on-dark */
42
+ --tui-background-highlight: var(--tui-const-white-alpha-10); /* @Deprecated: Переехал в отдельную группу service */
43
+ --tui-background-highlight-on-light: var(--tui-const-black-alpha-6); /* @Deprecated: Переехал в отдельную группу service */
44
+ --tui-background-highlight-on-dark: var(--tui-const-white-alpha-10); /* @Deprecated: Переехал в отдельную группу service */
45
+ --tui-background-highlight-on-opposite: var(--tui-const-black-alpha-6); /* @Deprecated: Переехал в отдельную группу service */
46
+ --tui-background-highlight-on-tinkoff: #FAB61966; /* @Deprecated: Переехал в отдельную группу service */
47
+ --tui-background-warning: var(--tui-const-yellow-darker-26); /* @Deprecated: Переехал в отдельную группу status */
48
+ --tui-background-warning-pressed: var(--tui-const-yellow-darker-32); /* @Deprecated: Переехал в отдельную группу status */
49
+ --tui-background-positive: var(--tui-const-green-darker-18); /* @Deprecated: Переехал в отдельную группу status */
50
+ --tui-background-positive-pressed: var(--tui-const-green-darker-21); /* @Deprecated: Переехал в отдельную группу status */
51
+ --tui-background-negative: var(--tui-const-red-darker-23); /* @Deprecated: Переехал в группу status */
52
+ --tui-background-negative-pressed: var(--tui-const-red-darker-29); /* @Deprecated: Переехал в группу status */
53
+ --tui-background-info: var(--tui-const-blue-darker-25); /* @Deprecated: Переехал в группу status */
54
+ --tui-background-info-pressed: var(--tui-const-blue-darker-32); /* @Deprecated: Переехал в группу status */
55
+ --tui-background-accent: var(--tui-const-blue); /* @Deprecated: Заменён на цвет accent-2 */
56
+ --tui-background-accent-pressed: var(--tui-const-blue-darker-46); /* @Deprecated: Заменён на цвет accent-2-pressed */
57
+ --tui-background-accent-pale: var(--tui-const-blue-alpha-16); /* @Deprecated: Заменён на компонентный токен */
58
+ --tui-background-accent-pale-pressed: var(--tui-const-blue-alpha-24); /* @Deprecated: Заменён на компонентный токен */
59
+ --tui-background-engaging: var(--tui-const-blue); /* @Deprecated: Заменён на цвет accent */
60
+ --tui-background-engaging-pressed: var(--tui-const-blue-darker-46); /* @Deprecated: Заменён на цвет accent-pressed */
61
+ --tui-background-brand-tinkoff: var(--tui-const-yellow); /* @Deprecated: Переехал в отдельную группу brand */
62
+ --tui-background-brand-pro: #AFF218; /* @Deprecated: Переехал в отдельную группу brand */
63
+ --tui-background-brand-premium: #4972CF; /* @Deprecated: Переехал в отдельную группу brand */
64
+ --tui-background-notification: var(--tui-const-red); /* @Deprecated: Переехал в компонентные токены */
65
+ --tui-background-selected-text: var(--tui-const-blue-alpha-24); /* @Deprecated: Переехал в отдельную группу service */
66
+ --tui-background-accent-1: var(--tui-const-yellow); /* Фоны акцентных кнопок, бейджей и т.д. */
67
+ --tui-background-accent-1-hover: var(--tui-const-yellow-darker-60); /* Только для веба. Фоны акцентных кнопок, бейджей и т.д. при наведении */
68
+ --tui-background-accent-1-pressed: var(--tui-const-yellow-darker-54); /* Фоны акцентных кнопок, бейджей и т.д. при нажатии */
69
+ --tui-background-accent-2: var(--tui-const-blue); /* Фоны акцентных кнопок, бейджей и т.д. */
70
+ --tui-background-accent-2-hover: var(--tui-const-blue-darker-52); /* Только для веба. Фоны акцентных кнопок, бейджей и т.д. при нажатии */
71
+ --tui-background-accent-2-pressed: var(--tui-const-blue-darker-46); /* Фоны акцентных кнопок, бейджей и т.д. */
72
+ --tui-background-accent-opposite: var(--tui-const-white); /* Фон, противоположный base: в белой теме — черный, в темной теме — белый */
73
+ --tui-background-accent-opposite-hover: var(--tui-const-cool-gray-lighter-97); /* Только для веба. Фон, противоположный base при наведении: в белой теме — черный, в темной теме — белый */
74
+ --tui-background-accent-opposite-pressed: var(--tui-const-cool-gray-lighter-93); /* Фон, противоположный base при нажатии: в белой теме — черный, в темной теме — белый */
75
+ --tui-background-accent-on-light: var(--tui-const-black); /* Контрастные контейнеры на светлых фонах, не меняется при смене темы */
76
+ --tui-background-accent-on-light-hover: var(--tui-const-black-lighter-16); /* Контрастные контейнеры при наведении на светлых фонах, не меняется при смене темы. */
77
+ --tui-background-accent-on-light-pressed: var(--tui-const-black-lighter-22); /* Контрастные контейнеры при нажатии на светлых фонах, не меняется при смене темы. */
78
+ --tui-background-accent-on-dark: var(--tui-const-white); /* Контрастные контейнеры на темных фонах, не меняется при смене темы */
79
+ --tui-background-accent-on-dark-hover: var(--tui-const-cool-gray-lighter-97); /* Контрастные контейнеры при наведении на темных фонах, не меняется при смене темы. */
80
+ --tui-background-accent-on-dark-pressed: var(--tui-const-cool-gray-lighter-93); /* Контрастные контейнеры при нажатии на темных фонах, не меняется при смене темы. */
81
+ --tui-background-button-close-on-light: var(--tui-const-black-alpha-40); /* Фон кнопки закрытия на светлом фоне. не меняется при переключении темы. бывший цвет neutral-3-on-light. Временный компонентный токен, существует пока не зарелизятся токены 2.0. */
82
+ --tui-background-button-close-on-dark: var(--tui-const-white-alpha-50); /* @Deprecated: Заменен на overlay-glass-on-dark */
83
+ --tui-background-badge-notification: var(--tui-const-red); /* Контейнеры нотификационных бейджей. Временный компонентный токен, существует пока не зарелизятся токены 2.0. */
84
+ --tui-background-toggle: var(--tui-const-white-alpha-20); /* @Deprecated: Заменен на background.neutral-2 */
85
+ --tui-background-button-vertical: var(--tui-const-blue-alpha-16); /* Фон tui-button [vertical]. Временный компонентный токен, существует пока не зарелизятся токены 2.0. */
86
+ --tui-background-button-vertical-hover: var(--tui-const-blue-alpha-20); /* Фон tui-button [vertical]. Временный компонентный токен, существует пока не зарелизятся токены 2.0. */
87
+ --tui-background-button-vertical-pressed: var(--tui-const-blue-alpha-24); /* Фон tui-button [vertical] при нажатии и наведении. Временный компонентный токен, существует пока не зарелизятся токены 2.0. */
88
+ --tui-background-button-glass-on-dark: var(--tui-const-white-alpha-30); /* @Deprecated: Заменен на overlay-glass-on-dark */
89
+ --tui-background-button-glass-on-light: var(--tui-const-black-alpha-40); /* @Deprecated: Заменен на overlay-glass-on-light */
90
+ --tui-background-progress-bar: var(--tui-const-white-alpha-15); /* Пустая полоска прогресс-баров. Временный компонентный токен, существует пока не зарелизятся токены 2.0. */
91
+ --tui-background-tooltip: var(--tui-const-white); /* Фон для тултипов */
92
+ --tui-background-thumbnail-card-badge: var(--tui-const-black-alpha-12); /* Прозрачный контейнер бейджа на миниатюре карты. Временный компонентный токен, существует пока не зарелизятся токены 2.0. */
93
+ --tui-background-overlay-glass: var(--tui-const-white-alpha-30); /* Оверлей стеклянных поверхностей */
94
+ --tui-background-overlay-glass-hover: var(--tui-const-white-alpha-40); /* Оверлей стеклянных поверхностей при наведении */
95
+ --tui-background-overlay-glass-pressed: var(--tui-const-white-alpha-50); /* Оверлей стеклянных поверхностей при нажатии */
96
+ --tui-background-overlay-glass-on-dark: var(--tui-const-white-alpha-30); /* Оверлей стеклянных поверхностей на темных фонах, не меняется при смене темы. */
97
+ --tui-background-overlay-glass-on-dark-hover: var(--tui-const-white-alpha-40); /* Оверлей стеклянных поверхностей при наведении на темных фонах, не меняется при смене темы. */
98
+ --tui-background-overlay-glass-on-dark-pressed: var(--tui-const-white-alpha-50); /* Оверлей стеклянных поверхностей при нажатии на темных фонах, не меняется при смене темы. */
99
+ --tui-background-overlay-glass-on-light: var(--tui-const-black-alpha-40); /* Оверлей стеклянных поверхностей на светлых фонах, не меняется при смене темы */
100
+ --tui-background-overlay-glass-on-light-pressed: var(--tui-const-black-alpha-60); /* Оверлей стеклянных поверхностей при нажатии на светлых фонах, не меняется при смене темы. */
101
+ --tui-background-overlay-glass-on-light-hover: var(--tui-const-black-alpha-48); /* Оверлей стеклянных поверхностей при наведении на светлых фонах, не меняется при смене темы. */
102
+ --tui-background-overlay-glass-matte: var(--tui-const-black-lighter-13-alpha-80); /* Оверлей матовых стеклянных поверхностей, не меняется при смене темы. */
103
+ --tui-background-overlay-on-image: var(--tui-const-black-alpha-30); /* Оверлей поверх изображений, не меняется от темы. */
104
+ --tui-border-normal: var(--tui-const-white-alpha-15); /* Бордеры и сепараторы на основных фонах */
105
+ --tui-border-normal-pale: var(--tui-const-white-alpha-9); /* Бледные бордеры и сепараторы на основных фонах */
106
+ --tui-border-hover: var(--tui-const-white-alpha-20); /* Только для веба. Бордеры при наведении */
107
+ --tui-border-normal-opaque: var(--tui-const-black-lighter-25); /* Бордеры и сепараторы на основных фонах без прозрачности */
108
+ --tui-border-normal-opaque-hover: var(--tui-const-black-lighter-30); /* Бордеры и сепараторы на основных фонах без прозрачности */
109
+ --tui-border-normal-pale-opaque: var(--tui-const-black-lighter-20); /* Бледные непрозрачные бордеры и сепараторы на основных фонах */
110
+ --tui-border-normal-strong: var(--tui-const-white-alpha-40); /* Бордеры и сепараторы на основных фонах */
111
+ --tui-border-focus: var(--tui-const-white); /* Только для веба. Бордеры при фокусировании с клавиатуры */
112
+ --tui-border-focus-on-dark: var(--tui-const-white-alpha-30); /* Только для веба. Бордеры при фокусировании с клавиатуры темных элементов */
113
+ --tui-border-selected: var(--tui-const-yellow); /* Обводка выделенных элементов */
114
+ --tui-border-selected-grayscale: var(--tui-const-cool-gray-lighter-93); /* Обводка выделенных элементов */
115
+ --tui-border-darkmode-only: var(--tui-const-white-alpha-10); /* Обводка, отделяющая цветные элементы от фона в темной теме */
116
+ --tui-border-on-light: var(--tui-const-cool-gray-alpha-12); /* Обводка, отделяющая цветные элементы от светлого фонов */
117
+ --tui-border-on-light-hover: var(--tui-const-cool-gray-alpha-22); /* Обводка, отделяющая цветные элементы на светлых фонах */
118
+ --tui-border-on-dark: var(--tui-const-white-alpha-15); /* Обводка, отделяющая цветные элементы на темных фонах */
119
+ --tui-border-on-dark-hover: var(--tui-const-white-alpha-20); /* Обводка, отделяющая цветные элементы на темных фонах при наведении */
120
+ --tui-brand-t-bank: #FFDD2D; /* Фирменный цвет. Используется, например, в бейдже подписки Team */
121
+ --tui-brand-pro: #AFF218; /* Цвет подписки Pro, для фонов кнопок, бейджей и т.д. */
122
+ --tui-brand-pro-alt-1: #9AF526; /* Дополнительный цвет подписки Pro. */
123
+ --tui-brand-premium: #4972CF; /* Цвет подписки Premium, для фонов кнопок, бейджей и т.д. */
124
+ --tui-brand-black: #333333; /* Фирменный цвет T-Bank Black */
125
+ --tui-brand-platinum: #747B8F; /* Фирменный цвет T-Bank Platinum */
126
+ --tui-brand-t-mobile: #5848C3; /* Фирменный цвет Tinkoff Mobile */
127
+ --tui-brand-t-mobile-alt-1: #BAB3EC; /* Альтеранитивный фирменный цвет T-Mobile */
128
+ --tui-brand-t-mobile-alt-2: #EDE8F6; /* Альтеранитивный фирменный цвет T-Mobile */
129
+ --tui-brand-all-airlines: #27BEFF; /* Фирменный цвет All Airlines */
130
+ --tui-brand-all-airlines-alt-1: #CBEFFF; /* Бледный оттенок фирменного цвета All Airlines */
131
+ --tui-brand-t-ai-assistant: #9A6BFF; /* Фирменный цвет Tinkoff Ai Assistant */
132
+ --tui-brand-t-insurance: #27AFA5; /* Фирменный цвет Страхования */
133
+ --tui-brand-t-business: #B58B60; /* Фирменный цвет Бизнеса */
134
+ --tui-brand-t-business-alt-1: #E4D7C1; /* Фирменный цвет Бизнеса */
135
+ --tui-brand-t-invest: #41414D; /* Фирменный цвет Инвестиций */
136
+ --tui-brand-private: #212121; /* Фирменный цвет подписки Private */
137
+ --tui-brand-mir-pay: #006848; /* Цвет для кнопок Mir Pay */
138
+ --tui-brand-t-insurance-alt-1: #D0F4F2; /* Бледный оттенок фирменного цвета Страхования */
139
+ --tui-brand-tinkoff: #FFDD2D; /* @Deprecated: Заменён на t-bank */
140
+ --tui-brand-tinkoff-pro: #AFF218; /* @Deprecated: Заменён на t-pro */
141
+ --tui-brand-tinkoff-premium: #4972CF; /* @Deprecated: Заменён на t-premium */
142
+ --tui-brand-tinkoff-black: #333333; /* @Deprecated: Заменён на t-black */
143
+ --tui-brand-tinkoff-platinum: #747B8F; /* @Deprecated: Заменён на t-platinum */
144
+ --tui-brand-tinkoff-mobile: #5848C3; /* @Deprecated: Заменён на t-mobile */
145
+ --tui-brand-tinkoff-mobile-alt-1: #BAB3EC; /* @Deprecated: Заменён на t-mobile-alt-1 */
146
+ --tui-brand-tinkoff-all-airlines: #27BEFF; /* @Deprecated: Заменён на t-all-airlines */
147
+ --tui-brand-tinkoff-all-airlines-alt-1: #CBEFFF; /* @Deprecated: Заменён на t-all-airlines-alt-1 */
148
+ --tui-brand-tinkoff-ai-assistant: #9A6BFF; /* @Deprecated: Заменён на t-ai-assistant */
149
+ --tui-brand-tinkoff-insurance: #27AFA5; /* @Deprecated: Заменён на t-insurance */
150
+ --tui-brand-tinkoff-business: #B58B60; /* @Deprecated: Заменён на t-business */
151
+ --tui-brand-tinkoff-business-alt-1: #E4D7C1; /* @Deprecated: Заменён на t-business-alt-1 */
152
+ --tui-brand-tinkoff-invest: #41414D; /* @Deprecated: Заменён на t-invest */
153
+ --tui-brand-tinkoff-private: #212121; /* @Deprecated: Заменён на t-private */
154
+ --tui-brand-tinkoff-insurance-pale: #D0F4F2; /* @Deprecated: Заменён на t-insurance-alt-1 */
155
+ --tui-brand-tinkoff-insurance-alt-1: #E1F9F7; /* @Deprecated: Заменён на t-insurance-alt-1 */
156
+ --tui-brand-t-all-airlines: var(--tui-brand-all-airlines); /* @Deprecated: Заменён на all-airlines */
157
+ --tui-brand-t-all-airlines-alt-1: var(--tui-brand-all-airlines-alt-1); /* @Deprecated: Заменён на all-airlines-alt-1 */
158
+ --tui-brand-t-black: var(--tui-brand-black); /* @Deprecated: Заменён на black */
159
+ --tui-brand-t-platinum: var(--tui-brand-platinum); /* @Deprecated: Заменён на platinum */
160
+ --tui-brand-t-premium: var(--tui-brand-premium); /* @Deprecated: Заменён на premium */
161
+ --tui-brand-t-pro: var(--tui-brand-pro); /* @Deprecated: Заменён на pro */
162
+ --tui-brand-t-private: var(--tui-brand-private); /* @Deprecated: Заменён на private */
163
+ --tui-chart-categorical-01: var(--tui-const-sea-blue);
164
+ --tui-chart-categorical-02: var(--tui-const-purple-darker-72);
165
+ --tui-chart-categorical-03: var(--tui-const-coral-darker-60);
166
+ --tui-chart-categorical-04: var(--tui-const-turquoise);
167
+ --tui-chart-categorical-05: var(--tui-const-orange);
168
+ --tui-chart-categorical-06: var(--tui-const-purple);
169
+ --tui-chart-categorical-07: var(--tui-const-green-darker-34);
170
+ --tui-chart-categorical-08: var(--tui-const-blue-darker-70);
171
+ --tui-chart-categorical-09: var(--tui-const-orange-darker-48);
172
+ --tui-chart-categorical-10: var(--tui-const-purple-darker-56);
173
+ --tui-chart-categorical-11: var(--tui-const-pink);
174
+ --tui-chart-categorical-12: var(--tui-const-sea-blue-darker-48);
175
+ --tui-chart-categorical-13: var(--tui-const-orange-darker-56);
176
+ --tui-chart-categorical-14: var(--tui-const-purple-darker-60);
177
+ --tui-chart-categorical-15: var(--tui-const-pink-darker-64);
178
+ --tui-chart-categorical-16: var(--tui-const-emerald-darker-42);
179
+ --tui-chart-categorical-17: var(--tui-const-coral);
180
+ --tui-chart-categorical-18: var(--tui-const-purple-darker-48);
181
+ --tui-chart-categorical-19: var(--tui-const-coral-darker-52);
182
+ --tui-chart-categorical-20: var(--tui-const-emerald);
183
+ --tui-chart-categorical-21: var(--tui-const-turquoise-darker-36);
184
+ --tui-chart-categorical-22: var(--tui-const-pink-darker-60);
185
+ --tui-chart-categorical-23: var(--tui-const-yellow-darker-60);
186
+ --tui-chart-categorical-24: var(--tui-const-turquoise-darker-40);
187
+ --tui-chart-categorical-25: var(--tui-const-green-lighter-64);
188
+ --tui-chart-categorical-26: var(--tui-const-sea-blue-lighter-66);
189
+ --tui-chart-categorical-27: var(--tui-const-green-lighter-57);
190
+ --tui-component-tab-bar-background-ios: #1A1A1DB3; /* Цвет фона для имитации системного таббара iOS */
191
+ --tui-component-input-background-autofill: var(--tui-const-yellow-darker-26); /* @Deprecated: Заменён на service.autofill-background */
192
+ --tui-const-yellow: #FFDD2D; /* N9 */
193
+ --tui-const-yellow-darker-88: #FFF5C2;
194
+ --tui-const-yellow-darker-60: #FFCD33; /* N9 pressed, hsL=60 */
195
+ --tui-const-yellow-darker-54: #FAB619; /* hsL=54 */
196
+ --tui-const-yellow-darker-50: #FAA805; /* hsL=50 */
197
+ --tui-const-yellow-darker-48: #F49C01; /* hsL=48 */
198
+ --tui-const-yellow-darker-38: #BF8003; /* hsL=38 */
199
+ --tui-const-yellow-darker-32: #806925; /* hsL=32 */
200
+ --tui-const-yellow-darker-26: #614F23; /* hsL=26 */
201
+ --tui-const-yellow-alpha-14: #FFDD2D24; /* 14% opacity */
202
+ --tui-const-yellow-alpha-24: #FFDD2D3D; /* 24% opacity */
203
+ --tui-const-yellow-alpha-28: #FFDD2D47; /* 28% opacity */
204
+ --tui-const-yellow-alpha-30: #FFDD2D4D; /* 30% opacity */
205
+ --tui-const-yellow-alpha-32: #FFDD2D52; /* 32% opacity */
206
+ --tui-const-yellow-alpha-40: #FFDD2D66; /* 40% opacity */
207
+ --tui-const-yellow-alpha-48: #FFDD2D7A; /* 48% opacity */
208
+ --tui-const-green-lighter-64: #94D274; /* hsL=64 */
209
+ --tui-const-green-lighter-57: #60C366; /* hsL=57 */
210
+ --tui-const-green-lighter-44: #00E037; /* hsL=44 */
211
+ --tui-const-green-lighter-42: #00D635; /* hsL=42 */
212
+ --tui-const-green: #00B92D; /* N11 */
213
+ --tui-const-green-darker-34: #00A328; /* hsL=34 */
214
+ --tui-const-green-darker-28: #038C24; /* hsL=28 */
215
+ --tui-const-green-darker-21: #115B24; /* hsL=21 */
216
+ --tui-const-green-darker-18: #144823;
217
+ --tui-const-green-alpha-16: #00B92D29; /* 16% opacity */
218
+ --tui-const-green-alpha-24: #00B92D3D; /* 24% opacity */
219
+ --tui-const-green-alpha-32: #00B92D52; /* 32% opacity */
220
+ --tui-const-green-alpha-38: #00B92D61; /* 38% opacity */
221
+ --tui-const-green-alpha-44: #00B92D70; /* 44% opacity */
222
+ --tui-const-blue: #428BF9; /* N8 */
223
+ --tui-const-blue-lighter-70: #6BA4FA; /* @Deprecated: Заменён на цвет blue-darker-70 */
224
+ --tui-const-blue-darker-79: #97BFFC; /* hsL=79 */
225
+ --tui-const-blue-darker-74: #7FB0FB; /* hsL=74 */
226
+ --tui-const-blue-darker-72: #75AAFA; /* hsL=72 */
227
+ --tui-const-blue-darker-70: #6BA4FA; /* hsL=70 */
228
+ --tui-const-blue-darker-66: #5798FA; /* hsL=66 */
229
+ --tui-const-blue-darker-52: #126DF7; /* hsL=52 */
230
+ --tui-const-blue-darker-46: #156ED4; /* N8 pressed, hsL=46 */
231
+ --tui-const-blue-darker-40: #1455B8; /* hsL=40 */
232
+ --tui-const-blue-darker-32: #2B4976; /* hsL=32 */
233
+ --tui-const-blue-darker-28: #2A4165; /* hsL=28 */
234
+ --tui-const-blue-darker-25: #263B5C; /* hsL=25 */
235
+ --tui-const-blue-alpha-8: #428BF914; /* 8% opacity */
236
+ --tui-const-blue-alpha-12: #428BF91F; /* 12% opacity */
237
+ --tui-const-blue-alpha-16: #428BF929; /* 16% opacity */
238
+ --tui-const-blue-alpha-20: #428BF933; /* 16% opacity */
239
+ --tui-const-blue-alpha-24: #428BF93D; /* 24% opacity */
240
+ --tui-const-blue-alpha-32: #428BF952; /* 32% opacity */
241
+ --tui-const-blue-alpha-38: #428BF961; /* 38% opacity */
242
+ --tui-const-blue-alpha-44: #428BF970; /* 44% opacity */
243
+ --tui-const-blue-alpha-64: #428BF9A3; /* 64% opacity */
244
+ --tui-const-dark-blue-alpha-6: #244A7F0F; /* 6% opacity */
245
+ --tui-const-dark-blue-alpha-8: #244A7F14; /* 8% opacity */
246
+ --tui-const-dark-blue-alpha-9: #244A7F17; /* 9% opacity */
247
+ --tui-const-dark-blue-alpha-10: #244A7F1A; /* 10% opacity */
248
+ --tui-const-dark-blue-alpha-11: #244A7F1C; /* 11% opacity */
249
+ --tui-const-dark-blue-alpha-12: #244A7F1F; /* 12% opacity */
250
+ --tui-const-red-alpha-14: #F5222224; /* 12% opacity */
251
+ --tui-const-red-alpha-24: #F522223D; /* 24% opacity */
252
+ --tui-const-red-alpha-32: #F5222252; /* 32% opacity */
253
+ --tui-const-red-alpha-38: #F5222261; /* 38% opacity */
254
+ --tui-const-red-alpha-44: #F5222270; /* 44% opacity */
255
+ --tui-const-red-lighter-62: #F74646; /* hsL=62 */
256
+ --tui-const-red-lighter-65: #FF4D4D; /* hsL=65 */
257
+ --tui-const-red-lighter-70: #FF6666; /* hsL=70 */
258
+ --tui-const-red: #F52222; /* N10 */
259
+ --tui-const-red-darker-53: #DC3233; /* hsL=53 */
260
+ --tui-const-red-darker-50: #DA2526; /* hsL=50 */
261
+ --tui-const-red-darker-47: #CD2324; /* hsL=47 */
262
+ --tui-const-red-darker-32: #9C0707; /* hsL=32 */
263
+ --tui-const-red-darker-29: #731F20; /* hsL=29 */
264
+ --tui-const-red-darker-23: #591E20; /* hsL=23 */
265
+ --tui-const-red-dim-27: #5D2C2D; /* hsL=27 */
266
+ --tui-const-white: #FFFFFF; /* N14 */
267
+ --tui-const-white-96: #FFFFFFF2; /* @Deprecated: Заменён на цвет white-alpha-96 */
268
+ --tui-const-white-90: #FFFFFFE6; /* @Deprecated: Заменён на цвет white-alpha-90 */
269
+ --tui-const-white-80: #FFFFFFCC; /* @Deprecated: Заменён на цвет white-alpha-90 */
270
+ --tui-const-white-70: #FFFFFFB3; /* @Deprecated: Заменён на цвет white-alpha-70 */
271
+ --tui-const-white-60: #FFFFFF99; /* @Deprecated: Заменён на цвет white-alpha-60 */
272
+ --tui-const-white-50: #FFFFFF80; /* @Deprecated: Заменён на цвет white-alpha-50 */
273
+ --tui-const-white-40: #FFFFFF66; /* @Deprecated: Заменён на цвет white-alpha-40 */
274
+ --tui-const-white-30: #FFFFFF4D; /* @Deprecated: Заменён на цвет white-alpha-30 */
275
+ --tui-const-white-20: #FFFFFF33; /* @Deprecated: Заменён на цвет white-alpha-20 */
276
+ --tui-const-white-15: #FFFFFF26; /* @Deprecated: Заменён на цвет white-alpha-15 */
277
+ --tui-const-white-10: #FFFFFF1A; /* @Deprecated: Заменён на цвет white-alpha-10 */
278
+ --tui-const-black: #000000; /* Бывший N15 */
279
+ --tui-const-black-90: #000000E6; /* @Deprecated: Заменён на цвет black-alpha-90 */
280
+ --tui-const-black-80: #000000CC; /* @Deprecated: Заменён на цвет black-alpha-80 */
281
+ --tui-const-black-70: #000000B3; /* @Deprecated: Заменён на цвет black-alpha-70 */
282
+ --tui-const-black-60: #00000099; /* @Deprecated: Заменён на цвет black-alpha-60 */
283
+ --tui-const-black-48: #0000007A; /* @Deprecated: Заменён на цвет black-alpha-48 */
284
+ --tui-const-black-40: #00000066; /* @Deprecated: Заменён на цвет black-alpha-40 */
285
+ --tui-const-black-30: #0000004D; /* @Deprecated: Заменён на цвет black-alpha-30 */
286
+ --tui-const-black-21: #00000036; /* @Deprecated: Заменён на цвет black-alpha-21 */
287
+ --tui-const-black-12: #0000001F; /* @Deprecated: Заменён на цвет black-alpha-12 */
288
+ --tui-const-black-6: #00000014; /* @Deprecated: Заменён на цвет black-alpha-6 */
289
+ --tui-const-black-3: #00000008; /* @Deprecated: Заменён на цвет black-alpha-3 */
290
+ --tui-const-gray-93: #121212; /* @Deprecated: Заменён на цвет color.const.black-lighter-7 */
291
+ --tui-const-gray-89: #1C1C1E; /* @Deprecated: Заменён на цвет color.const.cool-gray-lighter-11 */
292
+ --tui-const-gray-83: #2C2C2E; /* @Deprecated: Заменён на цвет color.const.cool-gray-lighter-18 */
293
+ --tui-const-gray-80: #333333; /* @Deprecated: Заменён на цвет color.const.black-lighter-20 */
294
+ --tui-const-gray-64: #575B61; /* @Deprecated: Заменён на цвет color.const.cool-gray-lighter-36 */
295
+ --tui-const-gray-40: #9299A2; /* @Deprecated: Заменён на цвет color.const.cool-gray-lighter-60 */
296
+ --tui-const-gray-21: #C7C9CC; /* @Deprecated: Заменён на цвет color.const.cool-gray-lighter-79 */
297
+ --tui-const-gray-13: #DDDFE0; /* @Deprecated: Заменён на цвет color.const.cool-gray-lighter-87 */
298
+ --tui-const-gray-8: #EAECEE; /* @Deprecated: Заменён на цвет color.const.cool-gray-lighter-93 */
299
+ --tui-const-gray-3: #F6F7F8; /* @Deprecated: Заменён на цвет color.const.cool-gray-lighter-97 */
300
+ --tui-const-cool-gray-56: #0010248F; /* @Deprecated: Заменён на цвет color.const.cool-gray-alpha-56 */
301
+ --tui-const-cool-gray-44: #00102470; /* @Deprecated: Заменён на цвет color.const.cool-gray-alpha-44 */
302
+ --tui-const-cool-gray-22: #00102438; /* @Deprecated: Заменён на цвет color.const.cool-gray-alpha-22 */
303
+ --tui-const-cool-gray-12: #0010241F; /* @Deprecated: Заменён на цвет color.const.cool-gray-alpha-12 */
304
+ --tui-const-cool-gray-6: #0010240F; /* @Deprecated: Заменён на цвет color.const.cool-gray-alpha-6 */
305
+ --tui-const-cool-gray-3: #00102408; /* @Deprecated: Заменён на цвет color.const.cool-gray-alpha-3 */
306
+ --tui-const-clear: #00000000;
307
+ --tui-const-red-clear: #F522223D; /* @Deprecated: Заменён на цвет red-alpha-24 */
308
+ --tui-const-red-clear-light: #F522221F; /* @Deprecated: Заменён на цвет red-alpha-14 */
309
+ --tui-const-blue-dark: #156ED4; /* @Deprecated: Заменён на цвет blue-darker-46 */
310
+ --tui-const-blue-clear: #428BF93D; /* @Deprecated: Заменён на цвет blue-alpha-24 */
311
+ --tui-const-blue-clear-light: #428BF91F; /* @Deprecated: Заменён на цвет blue-alpha-12 */
312
+ --tui-const-green-clear: #00B92D3D; /* @Deprecated: Заменён на цвет green-alpha-24 */
313
+ --tui-const-green-clear-light: #00B92D1F; /* @Deprecated: Заменён на цвет green-alpha-16 */
314
+ --tui-const-yellow-darker: #FAB619; /* @Deprecated: Заменён на цвет yellow-darker-54 */
315
+ --tui-const-yellow-dark: #FFCD33; /* @Deprecated: Заменён на цвет yellow-darker-60 */
316
+ --tui-const-yellow-clear-light: #FFDD2D24; /* @Deprecated: Заменён на цвет yellow-alpha-14 */
317
+ --tui-const-yellow-clear: #FFDD2D3D; /* @Deprecated: Заменён на цвет yellow-alpha-24 */
318
+ --tui-const-black-alpha-90: #000000E6; /* 90% opacity */
319
+ --tui-const-black-alpha-80: #000000CC; /* 80% opacity */
320
+ --tui-const-black-alpha-70: #000000B3; /* 70% opacity */
321
+ --tui-const-black-alpha-60: #00000099; /* 60% opacity */
322
+ --tui-const-black-alpha-54: #0000008A; /* 54% opacity */
323
+ --tui-const-black-alpha-50: #00000080; /* 50% opacity */
324
+ --tui-const-black-alpha-48: #0000007A; /* 48% opacity */
325
+ --tui-const-black-alpha-40: #00000066; /* 40% opacity */
326
+ --tui-const-black-alpha-32: #00000052; /* 32% opacity */
327
+ --tui-const-black-alpha-30: #0000004D; /* 30% opacity */
328
+ --tui-const-black-alpha-24: #0000003D; /* 24% opacity */
329
+ --tui-const-black-alpha-21: #00000036; /* 21% opacity */
330
+ --tui-const-black-alpha-18: #0000002E; /* 18% opacity */
331
+ --tui-const-black-alpha-12: #0000001F; /* 12% opacity */
332
+ --tui-const-black-alpha-10: #0000001A; /* 10% opacity */
333
+ --tui-const-black-alpha-7: #00000012; /* 7% opacity */
334
+ --tui-const-black-alpha-6: #0000000f; /* 6% opacity */
335
+ --tui-const-black-alpha-4: #0000000A; /* 4% opacity */
336
+ --tui-const-black-alpha-3: #00000008; /* 3% opacity */
337
+ --tui-const-white-alpha-96: #FFFFFFF5; /* 96% opacity */
338
+ --tui-const-white-alpha-90: #FFFFFFE6; /* 90% opacity */
339
+ --tui-const-white-alpha-80: #FFFFFFCC; /* 80% opacity */
340
+ --tui-const-white-alpha-70: #FFFFFFB3; /* 70% opacity */
341
+ --tui-const-white-alpha-60: #FFFFFF99; /* 60% opacity */
342
+ --tui-const-white-alpha-50: #FFFFFF80; /* 50% opacity */
343
+ --tui-const-white-alpha-40: #FFFFFF66; /* 40% opacity */
344
+ --tui-const-white-alpha-30: #FFFFFF4D; /* 30% opacity */
345
+ --tui-const-white-alpha-25: #FFFFFF40; /* 25% opacity */
346
+ --tui-const-white-alpha-20: #FFFFFF33; /* 20% opacity */
347
+ --tui-const-white-alpha-19: #FFFFFF30; /* 19% opacity */
348
+ --tui-const-white-alpha-16: #FFFFFF29; /* 16% opacity */
349
+ --tui-const-white-alpha-15: #FFFFFF26; /* 15% opacity */
350
+ --tui-const-white-alpha-13: #ffffff21; /* 13% opacity */
351
+ --tui-const-white-alpha-11: #FFFFFF1C; /* 11% opacity */
352
+ --tui-const-white-alpha-10: #FFFFFF1A; /* 10% opacity */
353
+ --tui-const-white-alpha-9: #FFFFFF17; /* 9% opacity */
354
+ --tui-const-white-alpha-6: #ffffff0F; /* 6% opacity */
355
+ --tui-const-black-lighter-7: #121212; /* N17 */
356
+ --tui-const-black-lighter-13: #202020;
357
+ --tui-const-cool-gray-lighter-11: #1C1C1E; /* N16 */
358
+ --tui-const-cool-gray-lighter-15: #252527;
359
+ --tui-const-cool-gray-lighter-18: #2C2C2E; /* N18 */
360
+ --tui-const-cool-gray-lighter-51: #79818C;
361
+ --tui-const-cool-gray-lighter-61: #959BA4;
362
+ --tui-const-black-lighter-16: #292929;
363
+ --tui-const-black-lighter-19: #303030;
364
+ --tui-const-black-lighter-20: #333333; /* N1 */
365
+ --tui-const-black-lighter-22: #383838;
366
+ --tui-const-black-lighter-25: #414141;
367
+ --tui-const-black-lighter-30: #4D4D4D;
368
+ --tui-const-black-lighter-60: #999999;
369
+ --tui-const-black-lighter-79: #C9C9C9;
370
+ --tui-const-black-lighter-92: #ECECEC;
371
+ --tui-const-black-lighter-13-alpha-80: #202020CC;
372
+ --tui-const-cool-gray-lighter-36: #575B61;
373
+ --tui-const-cool-gray-lighter-60: #9299A2; /* N3 */
374
+ --tui-const-cool-gray-lighter-79: #C7C9CC; /* N4 */
375
+ --tui-const-cool-gray-lighter-85: #C7CBCF;
376
+ --tui-const-cool-gray-lighter-87: #DDDFE0; /* N5 */
377
+ --tui-const-cool-gray-lighter-90: #E1E3E4;
378
+ --tui-const-cool-gray-lighter-93: #EAECEE; /* N6 */
379
+ --tui-const-cool-gray-lighter-94: #EDEFF2;
380
+ --tui-const-cool-gray-lighter-96: #F2F4F7; /* N7 */
381
+ --tui-const-cool-gray-lighter-97: #F6F7F8; /* N7 */
382
+ --tui-const-cool-gray-alpha-56: #0010248F; /* 56% opacity */
383
+ --tui-const-cool-gray-alpha-44: #00102470; /* 44% opacity */
384
+ --tui-const-cool-gray-alpha-22: #00102438; /* 22% opacity */
385
+ --tui-const-cool-gray-alpha-32: #00102452; /* 32% opacity */
386
+ --tui-const-cool-gray-alpha-18: #0010242E; /* 18% opacity */
387
+ --tui-const-cool-gray-alpha-12: #0010241F; /* 12% opacity */
388
+ --tui-const-cool-gray-alpha-8: #00102414; /* 8% opacity */
389
+ --tui-const-cool-gray-alpha-7: #00102412; /* 7% opacity */
390
+ --tui-const-cool-gray-alpha-6: #0010240F; /* 6% opacity */
391
+ --tui-const-cool-gray-alpha-5: #0010240D; /* 5% opacity */
392
+ --tui-const-cool-gray-alpha-3: #00102408; /* 3% opacity */
393
+ --tui-const-purple: #D08FFF;
394
+ --tui-const-purple-darker-72: #C277F8; /* hsL=72 */
395
+ --tui-const-purple-darker-60: #AB6AC8; /* hsL=60 */
396
+ --tui-const-purple-darker-56: #A25BC3; /* hsL=56 */
397
+ --tui-const-purple-darker-48: #8B4EA6; /* hsL=48 */
398
+ --tui-const-pink: #FF7A91;
399
+ --tui-const-pink-darker-64: #F6516C; /* hsL=64 */
400
+ --tui-const-pink-darker-60: #F53D5C; /* hsL=60 */
401
+ --tui-const-orange: #FFB74C;
402
+ --tui-const-orange-darker-56: #FFA51F; /* hsL=56 */
403
+ --tui-const-orange-darker-48: #F59200; /* hsL=48 */
404
+ --tui-const-coral: #FF6347;
405
+ --tui-const-coral-darker-60: #F5593D; /* hsL=60 */
406
+ --tui-const-coral-darker-52: #E74023; /* hsL=52 */
407
+ --tui-const-emerald: #36C578;
408
+ --tui-const-emerald-darker-42: #2EA866; /* hsL=42 */
409
+ --tui-const-sea-blue: #2ABBF4;
410
+ --tui-const-sea-blue-darker-48: #0B9CD5; /* hsL=42 */
411
+ --tui-const-sea-blue-lighter-66: #5ACAF6;
412
+ --tui-const-turquoise: #0BD5C1;
413
+ --tui-const-turquoise-darker-40: #0AC2AF; /* hsL=40 */
414
+ --tui-const-turquoise-darker-36: #09AE9E; /* hsL=36 */
415
+ --tui-feed-category-neutral: #90ADBF; /* Для ленты операций в МБ */
416
+ --tui-feed-category-neutral-pale: #2E3036; /* Для ленты операций в МБ */
417
+ --tui-foreground-neutral-accent: var(--tui-const-white-alpha-50); /* @Deprecated: Перенесен в группу status */
418
+ --tui-foreground-positive-accent: var(--tui-const-green); /* @Deprecated: Перенесен в группу status */
419
+ --tui-foreground-warning-accent: var(--tui-const-yellow-darker-60); /* @Deprecated: Перенесен в группу status */
420
+ --tui-foreground-negative-accent: var(--tui-const-red); /* @Deprecated: Перенесен в группу status */
421
+ --tui-foreground-info-accent: var(--tui-const-blue); /* @Deprecated: Перенесен в группу status */
422
+ --tui-foreground-on-light: var(--tui-const-black); /* @Deprecated: Заменен на accent-on-dark */
423
+ --tui-foreground-on-dark: var(--tui-const-white); /* @Deprecated: Заменен на accent-on-dark */
424
+ --tui-foreground-brand-tinkoff-accent: var(--tui-const-yellow); /* @Deprecated: Перенесен в отдельную группу */
425
+ --tui-foreground-skeleton: var(--tui-const-white-alpha-10); /* @Deprecated: Перенесен в отдельную группу */
426
+ --tui-foreground-separator: var(--tui-const-white-alpha-20); /* @Deprecated: Перенесен в отдельную группу */
427
+ --tui-foreground-border-darkmode: var(--tui-const-white-alpha-10); /* @Deprecated: Перенесен в отдельную группу */
428
+ --tui-foreground-border-on-light: var(--tui-const-black-alpha-3); /* @Deprecated: Перенесен в отдельную группу */
429
+ --tui-foreground-border-on-dark: var(--tui-const-white-alpha-10); /* @Deprecated: Перенесен в отдельную группу */
430
+ --tui-icon-pressed: var(--tui-const-white-alpha-90); /* @Deprecated: Для иконок используем цвета из группы text */
431
+ --tui-icon-hover: var(--tui-const-white-alpha-70); /* @Deprecated: Для иконок используем цвета из группы text */
432
+ --tui-icon-normal: var(--tui-const-white-alpha-50); /* @Deprecated: Для иконок используем цвета из группы text */
433
+ --tui-icon-action: var(--tui-const-blue-darker-70); /* @Deprecated: Для иконок используем цвета из группы text */
434
+ --tui-icon-action-hover: var(--tui-const-blue); /* @Deprecated: Для иконок используем цвета из группы text */
435
+ --tui-icon-action-pressed: var(--tui-const-blue-darker-52); /* @Deprecated: Для иконок используем цвета из группы text */
436
+ --tui-icon-on-dark: var(--tui-const-white); /* @Deprecated: Для иконок используем цвета из группы text */
437
+ --tui-service-autofill-background: var(--tui-const-yellow-darker-26); /* Цвет фона при автозаполнении форм */
438
+ --tui-service-skeleton: var(--tui-const-white-alpha-10); /* Цвет для шиммеров, отображаемых при загрузке экрана */
439
+ --tui-service-skeleton-on-dark: var(--tui-const-white-alpha-15); /* Скелетон на темном фоне, не меняется при переключении темы */
440
+ --tui-service-selected-text: var(--tui-const-blue-alpha-24); /* @Deprecated: Заменён на service.selection-background */
441
+ --tui-service-selection-background: var(--tui-const-blue-alpha-24); /* Фон при выделении текста и изображений */
442
+ --tui-service-highlight-background: var(--tui-const-yellow-alpha-32); /* Фон под выделенным текстом */
443
+ --tui-service-backdrop: var(--tui-const-black-alpha-70); /* Затемнение на фоне модальных окон и шторок */
444
+ --tui-service-underline: var(--tui-const-blue-darker-66); /* Подчеркивание для ссылок */
445
+ --tui-service-underline-hover: var(--tui-const-blue-darker-70); /* Подчеркивание для ссылок */
446
+ --tui-service-underline-pressed: var(--tui-const-blue-darker-46); /* Подчеркивание для ссылок */
447
+ --tui-service-underline-grayscale: var(--tui-const-white-alpha-50); /* Подчеркивание для монохромных ссылок */
448
+ --tui-service-underline-grayscale-hover: var(--tui-const-white-alpha-90); /* Подчеркивание для монохромных ссылок */
449
+ --tui-service-underline-grayscale-pressed: var(--tui-const-white-alpha-50); /* Подчеркивание для монохромных ссылок */
450
+ --tui-service-underline-grayscale-on-dark: var(--tui-const-white-alpha-50); /* Подчеркивание для монохромных ссылок на тёмных фонах, не меняется при смене темы */
451
+ --tui-service-underline-grayscale-on-dark-hover: var(--tui-const-white); /* Подчеркивание для монохромных ссылок на тёмных фонах, не меняется при смене темы */
452
+ --tui-service-underline-grayscale-on-dark-pressed: var(--tui-const-white-alpha-50); /* Подчеркивание для монохромных ссылок на тёмных фонах, не меняется при смене темы */
453
+ --tui-service-underline-grayscale-on-light: var(--tui-const-black-alpha-32); /* Подчеркивание для монохромных ссылок на светлых фонах, не меняется при смене темы */
454
+ --tui-service-underline-grayscale-on-light-hover: var(--tui-const-black-alpha-80); /* Подчеркивание для монохромных ссылок на светлых фонах, не меняется при смене темы */
455
+ --tui-service-underline-grayscale-on-light-pressed: var(--tui-const-black-alpha-40); /* Подчеркивание для монохромных ссылок на светлых фонах, не меняется при смене темы */
456
+ --tui-service-underline-monochrome: var(--tui-const-white-alpha-50); /* @Deprecated: Заменён на цвет underline-grayscale */
457
+ --tui-service-underline-on-dark: var(--tui-const-white-alpha-50); /* @Deprecated: Заменён на цвет underline-grayscale-on-dark */
458
+ --tui-service-link-visited: var(--tui-const-purple); /* Цвет для ссылок, открывшихся в прошлом */
459
+ --tui-service-link-on-dark-visited: var(--tui-const-purple); /* Цвет для ссылок на тёмных фонах, открывшихся в прошлом */
460
+ --tui-service-link-on-light-visited: var(--tui-const-purple-darker-48); /* Цвет для ссылок на светлых фонах, открывшихся в прошлом */
461
+ --tui-status-warning-pale: var(--tui-const-yellow-darker-26); /* Контейнеры предупреждающих блоков */
462
+ --tui-status-warning-pale-hover: var(--tui-const-yellow-darker-32); /* Только для веба. Контейнеры предупреждающих блоков при наведении */
463
+ --tui-status-warning-pale-pressed: var(--tui-const-yellow-darker-32); /* Нажатое состояние контейнера предупреждающих блоков */
464
+ --tui-status-warning-pale-on-dark: var(--tui-const-yellow-alpha-24); /* Контейнеры предупреждающих блоков на тёмных фонах */
465
+ --tui-status-warning-pale-on-dark-hover: var(--tui-const-yellow-alpha-28); /* Контейнеры предупреждающих блоков на тёмных фонах */
466
+ --tui-status-warning-pale-on-dark-pressed: var(--tui-const-yellow-alpha-32); /* Контейнеры предупреждающих блоков на тёмных фонах */
467
+ --tui-status-positive-pale: var(--tui-const-green-darker-18); /* Контейнеры позитивных блоков */
468
+ --tui-status-positive-pale-hover: var(--tui-const-green-darker-21); /* Только для веба. Контейнеры позитивных блоков при наведении */
469
+ --tui-status-positive-pale-pressed: var(--tui-const-green-darker-21); /* Нажатое состояние positive в iOS */
470
+ --tui-status-positive-pale-on-dark: var(--tui-const-green-alpha-32); /* Контейнеры позитивных блоков на тёмных фонах, не меняются от темы */
471
+ --tui-status-positive-pale-on-dark-hover: var(--tui-const-green-alpha-38); /* Только для веба. Контейнеры позитивных блоков на тёмных фонах при наведении */
472
+ --tui-status-positive-pale-on-dark-pressed: var(--tui-const-green-alpha-44); /* Нажатое состояние positive-on-dark */
473
+ --tui-status-negative-pale: var(--tui-const-red-dim-27); /* Контейнеры негативных блоков */
474
+ --tui-status-negative-pale-hover: var(--tui-const-red-darker-29); /* Только для веба. Контейнеры негативных блоков при наведении */
475
+ --tui-status-negative-pale-pressed: var(--tui-const-red-darker-29); /* Нажатое состояние negative в iOS */
476
+ --tui-status-negative-pale-on-dark: var(--tui-const-red-alpha-32); /* Контейнеры негативных блоков на тёмных фонах */
477
+ --tui-status-negative-pale-on-dark-hover: var(--tui-const-red-alpha-38); /* Только для веба. Контейнеры негативных блоков на тёмных фонах при наведении */
478
+ --tui-status-negative-pale-on-dark-pressed: var(--tui-const-red-alpha-44); /* Нажатое состояние negative-pale-on-dark */
479
+ --tui-status-info-pale: var(--tui-const-blue-darker-25); /* Контейнеры информационных блоков */
480
+ --tui-status-info-pale-hover: var(--tui-const-blue-darker-32); /* Только для веба. Контейнеры информационных блоков при наведении */
481
+ --tui-status-info-pale-pressed: var(--tui-const-blue-darker-32); /* Контейнеры информационных блоков при нажатии */
482
+ --tui-status-info-pale-on-dark: var(--tui-const-blue-alpha-32); /* Контейнеры информационных блоков на тёмных фонах */
483
+ --tui-status-info-pale-on-dark-hover: var(--tui-const-blue-alpha-38); /* Контейнеры информационных блоков на тёмных фонах */
484
+ --tui-status-info-pale-on-dark-pressed: var(--tui-const-blue-alpha-44); /* Контейнеры информационных блоков на тёмных фонах */
485
+ --tui-status-neutral: var(--tui-const-cool-gray-lighter-61); /* Акцентный цвет для нейтральных фонах */
486
+ --tui-status-neutral-pale: var(--tui-const-white-alpha-15); /* Фоновый контейнер нейтральных статусных блоков */
487
+ --tui-status-neutral-pale-hover: var(--tui-const-white-alpha-25); /* Фоновый контейнер нейтральных статусных блоков при наведении */
488
+ --tui-status-neutral-pale-pressed: var(--tui-const-white-alpha-30); /* Фоновый контейнер нейтральных статусных блоков при нажатии */
489
+ --tui-status-positive: var(--tui-const-green-darker-28); /* Акцентный цвет для позитивных блоков */
490
+ --tui-status-warning: var(--tui-const-yellow-darker-60); /* Акцентный цвет для предупреждающих блоков */
491
+ --tui-status-negative: var(--tui-const-red-darker-47); /* Акцентный цвет для негативных блоков */
492
+ --tui-status-negative-hover: var(--tui-const-red-darker-50); /* Акцентный цвет для негативных блоков при наведении */
493
+ --tui-status-negative-pressed: var(--tui-const-red-darker-53); /* Акцентный цвет для негативных блоков при нажатии */
494
+ --tui-status-info: var(--tui-const-blue-darker-46); /* Акцентный цвет для информационных блоков */
495
+ --tui-support-support-01: #00BEE0; /* @Deprecated: Замена на семантические цвета */
496
+ --tui-support-support-02: #9887F1; /* @Deprecated: Замена на семантические цвета */
497
+ --tui-support-support-03: #F94D4D; /* @Deprecated: Замена на семантические цвета */
498
+ --tui-support-support-04: #34BFB1; /* @Deprecated: Замена на семантические цвета */
499
+ --tui-support-support-05: #FFAD5C; /* @Deprecated: Замена на семантические цвета */
500
+ --tui-support-support-06: #929DED; /* @Deprecated: Замена на семантические цвета */
501
+ --tui-support-support-07: #45AD2D; /* @Deprecated: Замена на семантические цвета */
502
+ --tui-support-support-08: #3392DB; /* @Deprecated: Замена на семантические цвета */
503
+ --tui-support-support-09: #DF8400; /* @Deprecated: Замена на семантические цвета */
504
+ --tui-support-support-10: #AE59D4; /* @Deprecated: Замена на семантические цвета */
505
+ --tui-support-support-11: #FD7171; /* @Deprecated: Замена на семантические цвета */
506
+ --tui-support-support-12: #52BBE1; /* @Deprecated: Замена на семантические цвета */
507
+ --tui-support-support-13: #FE9B4B; /* @Deprecated: Замена на семантические цвета */
508
+ --tui-support-support-14: #BF69F1; /* @Deprecated: Замена на семантические цвета */
509
+ --tui-support-support-15: #EC4D6B; /* @Deprecated: Замена на семантические цвета */
510
+ --tui-support-support-16: #3DAF69; /* @Deprecated: Замена на семантические цвета */
511
+ --tui-support-support-17: #FF7047; /* @Deprecated: Замена на семантические цвета */
512
+ --tui-support-support-18: #994ABD; /* @Deprecated: Замена на семантические цвета */
513
+ --tui-support-support-19: #DD4444; /* @Deprecated: Замена на семантические цвета */
514
+ --tui-support-support-20: #36C578; /* @Deprecated: Замена на семантические цвета */
515
+ --tui-support-support-21: #1DACA4; /* @Deprecated: Замена на семантические цвета */
516
+ --tui-support-support-22: #F14789; /* @Deprecated: Замена на семантические цвета */
517
+ --tui-text-primary: var(--tui-const-white-alpha-90); /* Основной текст и иконки фонах base, elevation, neutral */
518
+ --tui-text-primary-hover: var(--tui-const-white-alpha-70); /* Основной текст и иконки фонах base, elevation, neutral при наведении */
519
+ --tui-text-primary-pressed: var(--tui-const-white-alpha-50); /* Основной текст и иконки фонах base, elevation, neutral при нажатии */
520
+ --tui-text-primary-on-light: var(--tui-const-black-alpha-80); /* Основной текст и иконки на светлых фонах, не меняется при смене темы */
521
+ --tui-text-primary-on-light-hover: var(--tui-const-black-alpha-50); /* Основной текст и иконки на светлых фонах, не меняется при смене темы */
522
+ --tui-text-primary-on-light-pressed: var(--tui-const-black-alpha-40); /* Основной текст и иконки на светлых фонах, не меняется при смене темы */
523
+ --tui-text-primary-on-dark: var(--tui-const-white); /* Основной текст и иконки темных фонах. Не меняется при смене темы */
524
+ --tui-text-primary-on-dark-hover: var(--tui-const-white-alpha-70); /* Основной текст и иконки темных фонах. Не меняется при смене темы */
525
+ --tui-text-primary-on-dark-pressed: var(--tui-const-white-alpha-50); /* Основной текст и иконки темных фонах. Не меняется при смене темы */
526
+ --tui-text-primary-on-t-bank: var(--tui-const-black-lighter-20); /* Текст и иконки на фонах t-bank */
527
+ --tui-text-primary-on-opposite: var(--tui-const-black); /* Текст и иконки фоне opposite */
528
+ --tui-text-primary-on-accent-1: var(--tui-const-black-lighter-20); /* Текст и иконки фоне accent-1 */
529
+ --tui-text-primary-on-accent-2: var(--tui-const-white); /* Текст и иконки фоне accent-2 */
530
+ --tui-text-secondary: var(--tui-const-white-alpha-70); /* Второстепенный текст на фонах base, elevation, neutral */
531
+ --tui-text-secondary-hover: var(--tui-const-white-alpha-80); /* Второстепенный текст на фонах base, elevation, neutral при наведении */
532
+ --tui-text-secondary-pressed: var(--tui-const-white-alpha-96); /* Второстепенный текст на фонах base, elevation, neutral при нажатии */
533
+ --tui-text-secondary-on-light: var(--tui-const-black-alpha-48); /* Второстепенный текст на светлых фонах, не меняется при смене темы */
534
+ --tui-text-secondary-on-dark: var(--tui-const-white-alpha-70); /* Второстепенный текст на темных фонах, не меняется при смене темы */
535
+ --tui-text-tertiary: var(--tui-const-white-alpha-50); /* Лейблы задизейбленных кнопок, дисклеймеры */
536
+ --tui-text-tertiary-hover: var(--tui-const-white-alpha-70); /* Лейблы задизейбленных кнопок, дисклеймеры при наведении */
537
+ --tui-text-tertiary-pressed: var(--tui-const-white-alpha-80); /* Лейблы задизейбленных кнопок, дисклеймеры, дисклеймеры при нажатии */
538
+ --tui-text-tertiary-on-light: var(--tui-const-black-alpha-40); /* Лейблы задизейбленных кнопок, дисклеймеры на светлых фонах, не меняется при смене темы */
539
+ --tui-text-tertiary-on-dark: var(--tui-const-white-alpha-50); /* Лейблы задизейбленных кнопок, дисклеймеры на светлых фонах, не меняется при смене темы */
540
+ --tui-text-action: var(--tui-const-blue-darker-70); /* Текст и иконки интерактивного текста на фонах base, elevation и neutral. Заменяет цвет engaging и accent */
541
+ --tui-text-action-hover: var(--tui-const-blue-darker-52); /* Только для веба. Состояние текста при наведении */
542
+ --tui-text-action-pressed: var(--tui-const-blue-darker-40); /* Нажатое состояние интерактивного текста. Заменяет цвет engaging-pressed и accent-pressed */
543
+ --tui-text-action-on-dark: var(--tui-const-blue-darker-72); /* Текст и иконки интерактивного текста на тёмных фонах */
544
+ --tui-text-accent: var(--tui-const-blue); /* @Deprecated: Заменён на цвет action */
545
+ --tui-text-accent-pressed: var(--tui-const-blue-darker-46); /* @Deprecated: Заменён на цвет action-pressed */
546
+ --tui-text-engaging: var(--tui-const-blue); /* @Deprecated: Заменён на цвет accent */
547
+ --tui-text-engaging-pressed: var(--tui-const-blue-darker-46); /* @Deprecated: Заменён на цвет accent-pressed */
548
+ --tui-text-positive: var(--tui-const-green-lighter-44); /* Текст позитивного лейбла, например пополнение счета или рост цены акций */
549
+ --tui-text-positive-hover: var(--tui-const-green); /* Только для веба. Текст позитивного лейбла при нажатии */
550
+ --tui-text-positive-on-dark: var(--tui-const-green-lighter-44); /* Текст позитивного лейбла на тёмном фоне, например пополнение счета или рост цены акций */
551
+ --tui-text-negative: var(--tui-const-red-lighter-62); /* Текст негативного лейбла, например падение цены акций или ошибка */
552
+ --tui-text-negative-hover: var(--tui-const-red); /* Только для веба. Текст негативного лейбла при наведении на вебе */
553
+ --tui-text-negative-on-dark: var(--tui-const-red-lighter-70); /* Текст негативного лейбла на тёмном фоне, например падение цены акций или ошибка */
554
+ --tui-text-warning: var(--tui-const-yellow-darker-54); /* Предупреждающие текст и иконки */
555
+ --tui-text-warning-hover: var(--tui-const-yellow-darker-38); /* Предупреждающие текст и иконки при наведении на вебе */
556
+ --tui-text-warning-on-dark: var(--tui-const-yellow-darker-54); /* Предупреждающие текст и иконки на тёмных фонах */
557
+ --tui-text-primary-on-tinkoff: var(--tui-const-black-lighter-20); /* @Deprecated: Заменён на цвет primary-on-t-bank */
558
+ }