@vkontakte/vkui-tokens 4.35.1 → 4.35.2-dev-cfbf64.0

package/themes/vkBase/cssVars/declarations/onlyVariablesLocalIncremental.css

@@ -307,6 +307,9 @@
 	--vkui--color_link_contrast: #FFFFFF;
 	--vkui--color_link_contrast--hover: #F5F5F7;
 	--vkui--color_link_contrast--active: #EBECEF;
+	--vkui--color_text_button: #2688EB;
+	--vkui--color_text_button--hover: #2483E4;
+	--vkui--color_text_button--active: #237EDD;
 	--vkui--color_icon_accent: #2688EB;
 	--vkui--color_icon_accent--hover: #2483E4;
 	--vkui--color_icon_accent--active: #237EDD;
@@ -352,6 +355,9 @@
 	--vkui--color_icon_negative: #E64646;
 	--vkui--color_icon_negative--hover: #DD4446;
 	--vkui--color_icon_negative--active: #D44245;
+	--vkui--color_icon_button: #2688EB;
+	--vkui--color_icon_button--hover: #2483E4;
+	--vkui--color_icon_button--active: #237EDD;
 	--vkui--color_stroke_accent: #2688EB;
 	--vkui--color_stroke_accent--hover: #2483E4;
 	--vkui--color_stroke_accent--active: #237EDD;
@@ -388,6 +394,9 @@
 	--vkui--color_field_border_alpha: rgba(0, 0, 0, 0.12);
 	--vkui--color_field_border_alpha--hover: rgba(0, 0, 0, 0.24);
 	--vkui--color_field_border_alpha--active: rgba(0, 0, 0, 0.36);
+	--vkui--color_stroke_button: #2688EB;
+	--vkui--color_stroke_button--hover: #2483E4;
+	--vkui--color_stroke_button--active: #237EDD;
 	--vkui--color_accent_blue: #3F8AE0;
 	--vkui--color_accent_blue--hover: #3C85D9;
 	--vkui--color_accent_blue--active: #3A80D3;

package/themes/vkBase/cssVars/theme/fallbacks/index.css

@@ -307,6 +307,9 @@
 	--vkui--color_link_contrast: var(--vkui--color_link_contrast, #FFFFFF);
 	--vkui--color_link_contrast--hover: var(--vkui--color_link_contrast--hover, #F5F5F7);
 	--vkui--color_link_contrast--active: var(--vkui--color_link_contrast--active, #EBECEF);
+	--vkui--color_text_button: var(--vkui--color_text_button, #2688EB);
+	--vkui--color_text_button--hover: var(--vkui--color_text_button--hover, #2483E4);
+	--vkui--color_text_button--active: var(--vkui--color_text_button--active, #237EDD);
 	--vkui--color_icon_accent: var(--vkui--color_icon_accent, #2688EB);
 	--vkui--color_icon_accent--hover: var(--vkui--color_icon_accent--hover, #2483E4);
 	--vkui--color_icon_accent--active: var(--vkui--color_icon_accent--active, #237EDD);
@@ -352,6 +355,9 @@
 	--vkui--color_icon_negative: var(--vkui--color_icon_negative, #E64646);
 	--vkui--color_icon_negative--hover: var(--vkui--color_icon_negative--hover, #DD4446);
 	--vkui--color_icon_negative--active: var(--vkui--color_icon_negative--active, #D44245);
+	--vkui--color_icon_button: var(--vkui--color_icon_button, #2688EB);
+	--vkui--color_icon_button--hover: var(--vkui--color_icon_button--hover, #2483E4);
+	--vkui--color_icon_button--active: var(--vkui--color_icon_button--active, #237EDD);
 	--vkui--color_stroke_accent: var(--vkui--color_stroke_accent, #2688EB);
 	--vkui--color_stroke_accent--hover: var(--vkui--color_stroke_accent--hover, #2483E4);
 	--vkui--color_stroke_accent--active: var(--vkui--color_stroke_accent--active, #237EDD);
@@ -388,6 +394,9 @@
 	--vkui--color_field_border_alpha: var(--vkui--color_field_border_alpha, rgba(0, 0, 0, 0.12));
 	--vkui--color_field_border_alpha--hover: var(--vkui--color_field_border_alpha--hover, rgba(0, 0, 0, 0.24));
 	--vkui--color_field_border_alpha--active: var(--vkui--color_field_border_alpha--active, rgba(0, 0, 0, 0.36));
+	--vkui--color_stroke_button: var(--vkui--color_stroke_button, #2688EB);
+	--vkui--color_stroke_button--hover: var(--vkui--color_stroke_button--hover, #2483E4);
+	--vkui--color_stroke_button--active: var(--vkui--color_stroke_button--active, #237EDD);
 	--vkui--color_accent_blue: var(--vkui--color_accent_blue, #3F8AE0);
 	--vkui--color_accent_blue--hover: var(--vkui--color_accent_blue--hover, #3C85D9);
 	--vkui--color_accent_blue--active: var(--vkui--color_accent_blue--active, #3A80D3);

package/themes/vkBase/cssVars/theme/fallbacks/index.less

@@ -224,6 +224,9 @@
 @color-link-contrast: var(--vkui--color_link_contrast, #FFFFFF);
 @color-link-contrast--hover: var(--vkui--color_link_contrast--hover, #F5F5F7);
 @color-link-contrast--active: var(--vkui--color_link_contrast--active, #EBECEF);
+@color-text-button: var(--vkui--color_text_button, #2688EB);
+@color-text-button--hover: var(--vkui--color_text_button--hover, #2483E4);
+@color-text-button--active: var(--vkui--color_text_button--active, #237EDD);
 @color-icon-accent: var(--vkui--color_icon_accent, #2688EB);
 @color-icon-accent--hover: var(--vkui--color_icon_accent--hover, #2483E4);
 @color-icon-accent--active: var(--vkui--color_icon_accent--active, #237EDD);
@@ -269,6 +272,9 @@
 @color-icon-negative: var(--vkui--color_icon_negative, #E64646);
 @color-icon-negative--hover: var(--vkui--color_icon_negative--hover, #DD4446);
 @color-icon-negative--active: var(--vkui--color_icon_negative--active, #D44245);
+@color-icon-button: var(--vkui--color_icon_button, #2688EB);
+@color-icon-button--hover: var(--vkui--color_icon_button--hover, #2483E4);
+@color-icon-button--active: var(--vkui--color_icon_button--active, #237EDD);
 @color-stroke-accent: var(--vkui--color_stroke_accent, #2688EB);
 @color-stroke-accent--hover: var(--vkui--color_stroke_accent--hover, #2483E4);
 @color-stroke-accent--active: var(--vkui--color_stroke_accent--active, #237EDD);
@@ -305,6 +311,9 @@
 @color-field-border-alpha: var(--vkui--color_field_border_alpha, rgba(0, 0, 0, 0.12));
 @color-field-border-alpha--hover: var(--vkui--color_field_border_alpha--hover, rgba(0, 0, 0, 0.24));
 @color-field-border-alpha--active: var(--vkui--color_field_border_alpha--active, rgba(0, 0, 0, 0.36));
+@color-stroke-button: var(--vkui--color_stroke_button, #2688EB);
+@color-stroke-button--hover: var(--vkui--color_stroke_button--hover, #2483E4);
+@color-stroke-button--active: var(--vkui--color_stroke_button--active, #237EDD);
 @color-accent-blue: var(--vkui--color_accent_blue, #3F8AE0);
 @color-accent-blue--hover: var(--vkui--color_accent_blue--hover, #3C85D9);
 @color-accent-blue--active: var(--vkui--color_accent_blue--active, #3A80D3);

package/themes/vkBase/cssVars/theme/fallbacks/index.pcss

@@ -225,6 +225,9 @@
 	--color-link-contrast: var(--vkui--color_link_contrast, #FFFFFF);
 	--color-link-contrast--hover: var(--vkui--color_link_contrast--hover, #F5F5F7);
 	--color-link-contrast--active: var(--vkui--color_link_contrast--active, #EBECEF);
+	--color-text-button: var(--vkui--color_text_button, #2688EB);
+	--color-text-button--hover: var(--vkui--color_text_button--hover, #2483E4);
+	--color-text-button--active: var(--vkui--color_text_button--active, #237EDD);
 	--color-icon-accent: var(--vkui--color_icon_accent, #2688EB);
 	--color-icon-accent--hover: var(--vkui--color_icon_accent--hover, #2483E4);
 	--color-icon-accent--active: var(--vkui--color_icon_accent--active, #237EDD);
@@ -270,6 +273,9 @@
 	--color-icon-negative: var(--vkui--color_icon_negative, #E64646);
 	--color-icon-negative--hover: var(--vkui--color_icon_negative--hover, #DD4446);
 	--color-icon-negative--active: var(--vkui--color_icon_negative--active, #D44245);
+	--color-icon-button: var(--vkui--color_icon_button, #2688EB);
+	--color-icon-button--hover: var(--vkui--color_icon_button--hover, #2483E4);
+	--color-icon-button--active: var(--vkui--color_icon_button--active, #237EDD);
 	--color-stroke-accent: var(--vkui--color_stroke_accent, #2688EB);
 	--color-stroke-accent--hover: var(--vkui--color_stroke_accent--hover, #2483E4);
 	--color-stroke-accent--active: var(--vkui--color_stroke_accent--active, #237EDD);
@@ -306,6 +312,9 @@
 	--color-field-border-alpha: var(--vkui--color_field_border_alpha, rgba(0, 0, 0, 0.12));
 	--color-field-border-alpha--hover: var(--vkui--color_field_border_alpha--hover, rgba(0, 0, 0, 0.24));
 	--color-field-border-alpha--active: var(--vkui--color_field_border_alpha--active, rgba(0, 0, 0, 0.36));
+	--color-stroke-button: var(--vkui--color_stroke_button, #2688EB);
+	--color-stroke-button--hover: var(--vkui--color_stroke_button--hover, #2483E4);
+	--color-stroke-button--active: var(--vkui--color_stroke_button--active, #237EDD);
 	--color-accent-blue: var(--vkui--color_accent_blue, #3F8AE0);
 	--color-accent-blue--hover: var(--vkui--color_accent_blue--hover, #3C85D9);
 	--color-accent-blue--active: var(--vkui--color_accent_blue--active, #3A80D3);

package/themes/vkBase/cssVars/theme/fallbacks/index.scss

@@ -224,6 +224,9 @@ $color-text-muted--active: var(--vkui--color_text_muted--active, #282B2F);
 $color-link-contrast: var(--vkui--color_link_contrast, #FFFFFF);
 $color-link-contrast--hover: var(--vkui--color_link_contrast--hover, #F5F5F7);
 $color-link-contrast--active: var(--vkui--color_link_contrast--active, #EBECEF);
+$color-text-button: var(--vkui--color_text_button, #2688EB);
+$color-text-button--hover: var(--vkui--color_text_button--hover, #2483E4);
+$color-text-button--active: var(--vkui--color_text_button--active, #237EDD);
 $color-icon-accent: var(--vkui--color_icon_accent, #2688EB);
 $color-icon-accent--hover: var(--vkui--color_icon_accent--hover, #2483E4);
 $color-icon-accent--active: var(--vkui--color_icon_accent--active, #237EDD);
@@ -269,6 +272,9 @@ $color-icon-positive--active: var(--vkui--color_icon_positive--active, #45A64A);
 $color-icon-negative: var(--vkui--color_icon_negative, #E64646);
 $color-icon-negative--hover: var(--vkui--color_icon_negative--hover, #DD4446);
 $color-icon-negative--active: var(--vkui--color_icon_negative--active, #D44245);
+$color-icon-button: var(--vkui--color_icon_button, #2688EB);
+$color-icon-button--hover: var(--vkui--color_icon_button--hover, #2483E4);
+$color-icon-button--active: var(--vkui--color_icon_button--active, #237EDD);
 $color-stroke-accent: var(--vkui--color_stroke_accent, #2688EB);
 $color-stroke-accent--hover: var(--vkui--color_stroke_accent--hover, #2483E4);
 $color-stroke-accent--active: var(--vkui--color_stroke_accent--active, #237EDD);
@@ -305,6 +311,9 @@ $color-image-border-alpha--active: var(--vkui--color_image_border_alpha--active,
 $color-field-border-alpha: var(--vkui--color_field_border_alpha, rgba(0, 0, 0, 0.12));
 $color-field-border-alpha--hover: var(--vkui--color_field_border_alpha--hover, rgba(0, 0, 0, 0.24));
 $color-field-border-alpha--active: var(--vkui--color_field_border_alpha--active, rgba(0, 0, 0, 0.36));
+$color-stroke-button: var(--vkui--color_stroke_button, #2688EB);
+$color-stroke-button--hover: var(--vkui--color_stroke_button--hover, #2483E4);
+$color-stroke-button--active: var(--vkui--color_stroke_button--active, #237EDD);
 $color-accent-blue: var(--vkui--color_accent_blue, #3F8AE0);
 $color-accent-blue--hover: var(--vkui--color_accent_blue--hover, #3C85D9);
 $color-accent-blue--active: var(--vkui--color_accent_blue--active, #3A80D3);

package/themes/vkBase/cssVars/theme/fallbacks/index.styl

@@ -224,6 +224,9 @@ $color-text-muted--active = var(--vkui--color_text_muted--active, #282B2F);
 $color-link-contrast = var(--vkui--color_link_contrast, #FFFFFF);
 $color-link-contrast--hover = var(--vkui--color_link_contrast--hover, #F5F5F7);
 $color-link-contrast--active = var(--vkui--color_link_contrast--active, #EBECEF);
+$color-text-button = var(--vkui--color_text_button, #2688EB);
+$color-text-button--hover = var(--vkui--color_text_button--hover, #2483E4);
+$color-text-button--active = var(--vkui--color_text_button--active, #237EDD);
 $color-icon-accent = var(--vkui--color_icon_accent, #2688EB);
 $color-icon-accent--hover = var(--vkui--color_icon_accent--hover, #2483E4);
 $color-icon-accent--active = var(--vkui--color_icon_accent--active, #237EDD);
@@ -269,6 +272,9 @@ $color-icon-positive--active = var(--vkui--color_icon_positive--active, #45A64A)
 $color-icon-negative = var(--vkui--color_icon_negative, #E64646);
 $color-icon-negative--hover = var(--vkui--color_icon_negative--hover, #DD4446);
 $color-icon-negative--active = var(--vkui--color_icon_negative--active, #D44245);
+$color-icon-button = var(--vkui--color_icon_button, #2688EB);
+$color-icon-button--hover = var(--vkui--color_icon_button--hover, #2483E4);
+$color-icon-button--active = var(--vkui--color_icon_button--active, #237EDD);
 $color-stroke-accent = var(--vkui--color_stroke_accent, #2688EB);
 $color-stroke-accent--hover = var(--vkui--color_stroke_accent--hover, #2483E4);
 $color-stroke-accent--active = var(--vkui--color_stroke_accent--active, #237EDD);
@@ -305,6 +311,9 @@ $color-image-border-alpha--active = var(--vkui--color_image_border_alpha--active
 $color-field-border-alpha = var(--vkui--color_field_border_alpha, rgba(0, 0, 0, 0.12));
 $color-field-border-alpha--hover = var(--vkui--color_field_border_alpha--hover, rgba(0, 0, 0, 0.24));
 $color-field-border-alpha--active = var(--vkui--color_field_border_alpha--active, rgba(0, 0, 0, 0.36));
+$color-stroke-button = var(--vkui--color_stroke_button, #2688EB);
+$color-stroke-button--hover = var(--vkui--color_stroke_button--hover, #2483E4);
+$color-stroke-button--active = var(--vkui--color_stroke_button--active, #237EDD);
 $color-accent-blue = var(--vkui--color_accent_blue, #3F8AE0);
 $color-accent-blue--hover = var(--vkui--color_accent_blue--hover, #3C85D9);
 $color-accent-blue--active = var(--vkui--color_accent_blue--active, #3A80D3);

package/themes/vkBase/cssVars/theme/index.js

@@ -2095,6 +2095,20 @@ var theme = {
             "value": "var(--vkui--color_link_contrast--active, #EBECEF)"
         }
     },
+    "colorTextButton": {
+        "normal": {
+            "name": "--vkui--color_text_button",
+            "value": "var(--vkui--color_text_button, #2688EB)"
+        },
+        "hover": {
+            "name": "--vkui--color_text_button--hover",
+            "value": "var(--vkui--color_text_button--hover, #2483E4)"
+        },
+        "active": {
+            "name": "--vkui--color_text_button--active",
+            "value": "var(--vkui--color_text_button--active, #237EDD)"
+        }
+    },
     "colorIconAccent": {
         "normal": {
             "name": "--vkui--color_icon_accent",
@@ -2305,6 +2319,20 @@ var theme = {
             "value": "var(--vkui--color_icon_negative--active, #D44245)"
         }
     },
+    "colorIconButton": {
+        "normal": {
+            "name": "--vkui--color_icon_button",
+            "value": "var(--vkui--color_icon_button, #2688EB)"
+        },
+        "hover": {
+            "name": "--vkui--color_icon_button--hover",
+            "value": "var(--vkui--color_icon_button--hover, #2483E4)"
+        },
+        "active": {
+            "name": "--vkui--color_icon_button--active",
+            "value": "var(--vkui--color_icon_button--active, #237EDD)"
+        }
+    },
     "colorStrokeAccent": {
         "normal": {
             "name": "--vkui--color_stroke_accent",
@@ -2473,6 +2501,20 @@ var theme = {
             "value": "var(--vkui--color_field_border_alpha--active, rgba(0, 0, 0, 0.36))"
         }
     },
+    "colorStrokeButton": {
+        "normal": {
+            "name": "--vkui--color_stroke_button",
+            "value": "var(--vkui--color_stroke_button, #2688EB)"
+        },
+        "hover": {
+            "name": "--vkui--color_stroke_button--hover",
+            "value": "var(--vkui--color_stroke_button--hover, #2483E4)"
+        },
+        "active": {
+            "name": "--vkui--color_stroke_button--active",
+            "value": "var(--vkui--color_stroke_button--active, #237EDD)"
+        }
+    },
     "colorAccentBlue": {
         "normal": {
             "name": "--vkui--color_accent_blue",

package/themes/vkBase/cssVars/theme/index.json

@@ -2093,6 +2093,20 @@
 			"value": "var(--vkui--color_link_contrast--active, #EBECEF)"
 		}
 	},
+	"colorTextButton": {
+		"normal": {
+			"name": "--vkui--color_text_button",
+			"value": "var(--vkui--color_text_button, #2688EB)"
+		},
+		"hover": {
+			"name": "--vkui--color_text_button--hover",
+			"value": "var(--vkui--color_text_button--hover, #2483E4)"
+		},
+		"active": {
+			"name": "--vkui--color_text_button--active",
+			"value": "var(--vkui--color_text_button--active, #237EDD)"
+		}
+	},
 	"colorIconAccent": {
 		"normal": {
 			"name": "--vkui--color_icon_accent",
@@ -2303,6 +2317,20 @@
 			"value": "var(--vkui--color_icon_negative--active, #D44245)"
 		}
 	},
+	"colorIconButton": {
+		"normal": {
+			"name": "--vkui--color_icon_button",
+			"value": "var(--vkui--color_icon_button, #2688EB)"
+		},
+		"hover": {
+			"name": "--vkui--color_icon_button--hover",
+			"value": "var(--vkui--color_icon_button--hover, #2483E4)"
+		},
+		"active": {
+			"name": "--vkui--color_icon_button--active",
+			"value": "var(--vkui--color_icon_button--active, #237EDD)"
+		}
+	},
 	"colorStrokeAccent": {
 		"normal": {
 			"name": "--vkui--color_stroke_accent",
@@ -2471,6 +2499,20 @@
 			"value": "var(--vkui--color_field_border_alpha--active, rgba(0, 0, 0, 0.36))"
 		}
 	},
+	"colorStrokeButton": {
+		"normal": {
+			"name": "--vkui--color_stroke_button",
+			"value": "var(--vkui--color_stroke_button, #2688EB)"
+		},
+		"hover": {
+			"name": "--vkui--color_stroke_button--hover",
+			"value": "var(--vkui--color_stroke_button--hover, #2483E4)"
+		},
+		"active": {
+			"name": "--vkui--color_stroke_button--active",
+			"value": "var(--vkui--color_stroke_button--active, #237EDD)"
+		}
+	},
 	"colorAccentBlue": {
 		"normal": {
 			"name": "--vkui--color_accent_blue",

package/themes/vkBase/docs.json

@@ -520,6 +520,18 @@
       }
     ]
   },
+  "colorIconButton": {
+    "tags": [
+      "color",
+      "icon"
+    ],
+    "desc": [
+      {
+        "type": "text",
+        "text": "Цвет иконок для кнопок"
+      }
+    ]
+  },
   "colorIconContrast": {
     "tags": [
       "color",
@@ -901,6 +913,18 @@
       }
     ]
   },
+  "colorStrokeButton": {
+    "tags": [
+      "color",
+      "stroke"
+    ],
+    "desc": [
+      {
+        "type": "text",
+        "text": "Цвет обводки для кнопок"
+      }
+    ]
+  },
   "colorStrokeContrast": {
     "tags": [
       "color",
@@ -962,6 +986,17 @@
       }
     ]
   },
+  "colorTextButton": {
+    "tags": [
+      "color"
+    ],
+    "desc": [
+      {
+        "type": "text",
+        "text": "Цвет текста для кнопок"
+      }
+    ]
+  },
   "colorTextContrast": {
     "tags": [
       "color",

package/themes/vkBase/index.css

@@ -307,6 +307,9 @@
 	--vkui--color_link_contrast: #FFFFFF;
 	--vkui--color_link_contrast--hover: #F5F5F7;
 	--vkui--color_link_contrast--active: #EBECEF;
+	--vkui--color_text_button: #2688EB;
+	--vkui--color_text_button--hover: #2483E4;
+	--vkui--color_text_button--active: #237EDD;
 	--vkui--color_icon_accent: #2688EB;
 	--vkui--color_icon_accent--hover: #2483E4;
 	--vkui--color_icon_accent--active: #237EDD;
@@ -352,6 +355,9 @@
 	--vkui--color_icon_negative: #E64646;
 	--vkui--color_icon_negative--hover: #DD4446;
 	--vkui--color_icon_negative--active: #D44245;
+	--vkui--color_icon_button: #2688EB;
+	--vkui--color_icon_button--hover: #2483E4;
+	--vkui--color_icon_button--active: #237EDD;
 	--vkui--color_stroke_accent: #2688EB;
 	--vkui--color_stroke_accent--hover: #2483E4;
 	--vkui--color_stroke_accent--active: #237EDD;
@@ -388,6 +394,9 @@
 	--vkui--color_field_border_alpha: rgba(0, 0, 0, 0.12);
 	--vkui--color_field_border_alpha--hover: rgba(0, 0, 0, 0.24);
 	--vkui--color_field_border_alpha--active: rgba(0, 0, 0, 0.36);
+	--vkui--color_stroke_button: #2688EB;
+	--vkui--color_stroke_button--hover: #2483E4;
+	--vkui--color_stroke_button--active: #237EDD;
 	--vkui--color_accent_blue: #3F8AE0;
 	--vkui--color_accent_blue--hover: #3C85D9;
 	--vkui--color_accent_blue--active: #3A80D3;

package/themes/vkBase/index.js

@@ -593,6 +593,11 @@ var theme = {
         "hover": "#F5F5F7",
         "active": "#EBECEF"
     },
+    "colorTextButton": {
+        "normal": "#2688EB",
+        "hover": "#2483E4",
+        "active": "#237EDD"
+    },
     "colorIconAccent": {
         "normal": "#2688EB",
         "hover": "#2483E4",
@@ -668,6 +673,11 @@ var theme = {
         "hover": "#DD4446",
         "active": "#D44245"
     },
+    "colorIconButton": {
+        "normal": "#2688EB",
+        "hover": "#2483E4",
+        "active": "#237EDD"
+    },
     "colorStrokeAccent": {
         "normal": "#2688EB",
         "hover": "#2483E4",
@@ -728,6 +738,11 @@ var theme = {
         "hover": "rgba(0, 0, 0, 0.24)",
         "active": "rgba(0, 0, 0, 0.36)"
     },
+    "colorStrokeButton": {
+        "normal": "#2688EB",
+        "hover": "#2483E4",
+        "active": "#237EDD"
+    },
     "colorAccentBlue": {
         "normal": "#3F8AE0",
         "hover": "#3C85D9",

package/themes/vkBase/index.json

@@ -591,6 +591,11 @@
 		"hover": "#F5F5F7",
 		"active": "#EBECEF"
 	},
+	"colorTextButton": {
+		"normal": "#2688EB",
+		"hover": "#2483E4",
+		"active": "#237EDD"
+	},
 	"colorIconAccent": {
 		"normal": "#2688EB",
 		"hover": "#2483E4",
@@ -666,6 +671,11 @@
 		"hover": "#DD4446",
 		"active": "#D44245"
 	},
+	"colorIconButton": {
+		"normal": "#2688EB",
+		"hover": "#2483E4",
+		"active": "#237EDD"
+	},
 	"colorStrokeAccent": {
 		"normal": "#2688EB",
 		"hover": "#2483E4",
@@ -726,6 +736,11 @@
 		"hover": "rgba(0, 0, 0, 0.24)",
 		"active": "rgba(0, 0, 0, 0.36)"
 	},
+	"colorStrokeButton": {
+		"normal": "#2688EB",
+		"hover": "#2483E4",
+		"active": "#237EDD"
+	},
 	"colorAccentBlue": {
 		"normal": "#3F8AE0",
 		"hover": "#3C85D9",

package/themes/vkBase/index.less

@@ -224,6 +224,9 @@
 @color-link-contrast: #FFFFFF;
 @color-link-contrast--hover: #F5F5F7;
 @color-link-contrast--active: #EBECEF;
+@color-text-button: #2688EB;
+@color-text-button--hover: #2483E4;
+@color-text-button--active: #237EDD;
 @color-icon-accent: #2688EB;
 @color-icon-accent--hover: #2483E4;
 @color-icon-accent--active: #237EDD;
@@ -269,6 +272,9 @@
 @color-icon-negative: #E64646;
 @color-icon-negative--hover: #DD4446;
 @color-icon-negative--active: #D44245;
+@color-icon-button: #2688EB;
+@color-icon-button--hover: #2483E4;
+@color-icon-button--active: #237EDD;
 @color-stroke-accent: #2688EB;
 @color-stroke-accent--hover: #2483E4;
 @color-stroke-accent--active: #237EDD;
@@ -305,6 +311,9 @@
 @color-field-border-alpha: rgba(0, 0, 0, 0.12);
 @color-field-border-alpha--hover: rgba(0, 0, 0, 0.24);
 @color-field-border-alpha--active: rgba(0, 0, 0, 0.36);
+@color-stroke-button: #2688EB;
+@color-stroke-button--hover: #2483E4;
+@color-stroke-button--active: #237EDD;
 @color-accent-blue: #3F8AE0;
 @color-accent-blue--hover: #3C85D9;
 @color-accent-blue--active: #3A80D3;

package/themes/vkBase/index.pcss

@@ -225,6 +225,9 @@
 	--color-link-contrast: #FFFFFF;
 	--color-link-contrast--hover: #F5F5F7;
 	--color-link-contrast--active: #EBECEF;
+	--color-text-button: #2688EB;
+	--color-text-button--hover: #2483E4;
+	--color-text-button--active: #237EDD;
 	--color-icon-accent: #2688EB;
 	--color-icon-accent--hover: #2483E4;
 	--color-icon-accent--active: #237EDD;
@@ -270,6 +273,9 @@
 	--color-icon-negative: #E64646;
 	--color-icon-negative--hover: #DD4446;
 	--color-icon-negative--active: #D44245;
+	--color-icon-button: #2688EB;
+	--color-icon-button--hover: #2483E4;
+	--color-icon-button--active: #237EDD;
 	--color-stroke-accent: #2688EB;
 	--color-stroke-accent--hover: #2483E4;
 	--color-stroke-accent--active: #237EDD;
@@ -306,6 +312,9 @@
 	--color-field-border-alpha: rgba(0, 0, 0, 0.12);
 	--color-field-border-alpha--hover: rgba(0, 0, 0, 0.24);
 	--color-field-border-alpha--active: rgba(0, 0, 0, 0.36);
+	--color-stroke-button: #2688EB;
+	--color-stroke-button--hover: #2483E4;
+	--color-stroke-button--active: #237EDD;
 	--color-accent-blue: #3F8AE0;
 	--color-accent-blue--hover: #3C85D9;
 	--color-accent-blue--active: #3A80D3;

package/themes/vkBase/index.scss

@@ -224,6 +224,9 @@ $color-text-muted--active: #282B2F;
 $color-link-contrast: #FFFFFF;
 $color-link-contrast--hover: #F5F5F7;
 $color-link-contrast--active: #EBECEF;
+$color-text-button: #2688EB;
+$color-text-button--hover: #2483E4;
+$color-text-button--active: #237EDD;
 $color-icon-accent: #2688EB;
 $color-icon-accent--hover: #2483E4;
 $color-icon-accent--active: #237EDD;
@@ -269,6 +272,9 @@ $color-icon-positive--active: #45A64A;
 $color-icon-negative: #E64646;
 $color-icon-negative--hover: #DD4446;
 $color-icon-negative--active: #D44245;
+$color-icon-button: #2688EB;
+$color-icon-button--hover: #2483E4;
+$color-icon-button--active: #237EDD;
 $color-stroke-accent: #2688EB;
 $color-stroke-accent--hover: #2483E4;
 $color-stroke-accent--active: #237EDD;
@@ -305,6 +311,9 @@ $color-image-border-alpha--active: rgba(0, 0, 0, 0.16);
 $color-field-border-alpha: rgba(0, 0, 0, 0.12);
 $color-field-border-alpha--hover: rgba(0, 0, 0, 0.24);
 $color-field-border-alpha--active: rgba(0, 0, 0, 0.36);
+$color-stroke-button: #2688EB;
+$color-stroke-button--hover: #2483E4;
+$color-stroke-button--active: #237EDD;
 $color-accent-blue: #3F8AE0;
 $color-accent-blue--hover: #3C85D9;
 $color-accent-blue--active: #3A80D3;

package/themes/vkBase/index.styl

@@ -224,6 +224,9 @@ $color-text-muted--active = #282B2F;
 $color-link-contrast = #FFFFFF;
 $color-link-contrast--hover = #F5F5F7;
 $color-link-contrast--active = #EBECEF;
+$color-text-button = #2688EB;
+$color-text-button--hover = #2483E4;
+$color-text-button--active = #237EDD;
 $color-icon-accent = #2688EB;
 $color-icon-accent--hover = #2483E4;
 $color-icon-accent--active = #237EDD;
@@ -269,6 +272,9 @@ $color-icon-positive--active = #45A64A;
 $color-icon-negative = #E64646;
 $color-icon-negative--hover = #DD4446;
 $color-icon-negative--active = #D44245;
+$color-icon-button = #2688EB;
+$color-icon-button--hover = #2483E4;
+$color-icon-button--active = #237EDD;
 $color-stroke-accent = #2688EB;
 $color-stroke-accent--hover = #2483E4;
 $color-stroke-accent--active = #237EDD;
@@ -305,6 +311,9 @@ $color-image-border-alpha--active = rgba(0, 0, 0, 0.16);
 $color-field-border-alpha = rgba(0, 0, 0, 0.12);
 $color-field-border-alpha--hover = rgba(0, 0, 0, 0.24);
 $color-field-border-alpha--active = rgba(0, 0, 0, 0.36);
+$color-stroke-button = #2688EB;
+$color-stroke-button--hover = #2483E4;
+$color-stroke-button--active = #237EDD;
 $color-accent-blue = #3F8AE0;
 $color-accent-blue--hover = #3C85D9;
 $color-accent-blue--active = #3A80D3;

package/themes/vkBase/struct.json

@@ -617,6 +617,11 @@
 			"hover": "#F5F5F7",
 			"active": "#EBECEF"
 		},
+		"colorTextButton": {
+			"normal": "#2688EB",
+			"hover": "#2483E4",
+			"active": "#237EDD"
+		},
 		"colorIconAccent": {
 			"normal": "#2688EB",
 			"hover": "#2483E4",
@@ -692,6 +697,11 @@
 			"hover": "#DD4446",
 			"active": "#D44245"
 		},
+		"colorIconButton": {
+			"normal": "#2688EB",
+			"hover": "#2483E4",
+			"active": "#237EDD"
+		},
 		"colorStrokeAccent": {
 			"normal": "#2688EB",
 			"hover": "#2483E4",
@@ -752,6 +762,11 @@
 			"hover": "rgba(0, 0, 0, 0.24)",
 			"active": "rgba(0, 0, 0, 0.36)"
 		},
+		"colorStrokeButton": {
+			"normal": "#2688EB",
+			"hover": "#2483E4",
+			"active": "#237EDD"
+		},
 		"colorAccentBlue": {
 			"normal": "#3F8AE0",
 			"hover": "#3C85D9",

package/themes/vkBaseDark/cssVars/declarations/index.css

@@ -308,6 +308,9 @@
 	--vkui--color_link_contrast: #FFFFFF;
 	--vkui--color_link_contrast--hover: #EBEDF0;
 	--vkui--color_link_contrast--active: #D7D8DB;
+	--vkui--color_text_button: #FFFFFF;
+	--vkui--color_text_button--hover: #EBEDF0;
+	--vkui--color_text_button--active: #D7D8DB;
 	--vkui--color_icon_accent: #529EF4;
 	--vkui--color_icon_accent--hover: #59A2F4;
 	--vkui--color_icon_accent--active: #60A6F5;
@@ -353,6 +356,9 @@
 	--vkui--color_icon_negative: #FF5C5C;
 	--vkui--color_icon_negative--hover: #FF6363;
 	--vkui--color_icon_negative--active: #FF6969;
+	--vkui--color_icon_button: #FFFFFF;
+	--vkui--color_icon_button--hover: #EBEDF0;
+	--vkui--color_icon_button--active: #D7D8DB;
 	--vkui--color_stroke_accent: #529EF4;
 	--vkui--color_stroke_accent--hover: #59A2F4;
 	--vkui--color_stroke_accent--active: #60A6F5;
@@ -389,6 +395,9 @@
 	--vkui--color_field_border_alpha: rgba(255, 255, 255, 0.12);
 	--vkui--color_field_border_alpha--hover: rgba(255, 255, 255, 0.16);
 	--vkui--color_field_border_alpha--active: rgba(255, 255, 255, 0.2);
+	--vkui--color_stroke_button: #FFFFFF;
+	--vkui--color_stroke_button--hover: #EBEDF0;
+	--vkui--color_stroke_button--active: #D7D8DB;
 	--vkui--color_accent_blue: #529EF4;
 	--vkui--color_accent_blue--hover: #59A2F4;
 	--vkui--color_accent_blue--active: #60A6F5;