feat: Align vibe's colors to new a11y based colors

packages/core/src/constants/colors.json

@@ -1,62 +1,62 @@
 {
   "black": "#000000",
-  "light_blue": "#61CAF7",
-  "basic_blue": "#0085FF",
-  "primary": "#0085FF",
+  "light_blue": "#61caf7",
+  "basic_blue": "#0085ff",
+  "primary": "#0085ff",
   "primary-hover": "#0071d9",
   "basic_light_blue": "#c7e6fa",
-  "link_color": "#1F76C2",
-  "dark_purple": "#893DC5",
-  "blue_links": "#0086c0",
-  "bazooka": "#F65F7C",
-  "dark_marble": "#F1F1F1",
-  "marble": "#F7F7F7",
-  "gainsboro": "#E1E1E1",
+  "link_color": "#1f76c2",
+  "dark_purple": "#893dc5",
+  "blue_links": "#007eb5",
+  "bazooka": "#f65f7c",
+  "dark_marble": "#f1f1f1",
+  "marble": "#f7f7f7",
+  "gainsboro": "#e1e1e1",
   "snow_white": "#ffffff",
-  "success": "#00CA72",
-  "grass_green": "#037F4C",
-  "dark_blue": "#0071D9",
-  "jeans": "#597BFC",
-  "purple": "#A358DF",
-  "error": "#E44258",
-  "egg_yolk": "#FFCB00",
-  "saladish": "#CCCC35",
-  "lipstick": "#F279F2",
-  "working_orange": "#FDAB3D",
-  "aqua": "#00D1D1",
-  "brown": "#7F5347",
+  "success": "#00ca72",
+  "grass_green": "#037f4c",
+  "dark_blue": "#0071d9",
+  "jeans": "#597bfc",
+  "purple": "#a358df",
+  "error": "#e44258",
+  "egg_yolk": "#ffcb00",
+  "saladish": "#cccc35",
+  "lipstick": "#f279f2",
+  "working_orange": "#fdab3d",
+  "aqua": "#00d1d1",
+  "brown": "#7f5347",
   "blackish": "#333333",
-  "explosive": "#C4C4C4",
-  "american_gray": "#808080",
+  "explosive": "#c4c4c4",
+  "american_gray": "#757575",
   "highlight_blue": "#e5f4ff",
   "pulse_text_color": "#333333",
   "highlight": "#cce9ff",
-  "placholder_gray": "#D8D8D8",
+  "placholder_gray": "#d8d8d8",
   "placeholder_light_gray": "#efefef",
   "scrollbar_gray": "#b2b2b2",
   "timeline_grid_blue": "#454662",
-  "timeline_blue": "#1C1F3B",
+  "timeline_blue": "#1c1f3b",
   "default_group_color": "#579bfc",
-  "very_light_gray": "#A1A1A1",
+  "very_light_gray": "#a1a1a1",
   "pulse_bg": "#f0f0f0",
   "jade": "#03c875",
-  "deadline_upcoming_indication": "#5D6387",
+  "deadline_upcoming_indication": "#5d6387",
   "form_purple": "#575c96",
   "form_btn_hover": "#0083d9",
-  "board_views_grey": "#6E6F8F",
-  "board_views_blue": "#1C1F3B",
-  "board_views_grey_hover": "#B2B3D0",
-  "board_views_blue_secondary": "#363A52",
-  "brand-blue": "#00A9FF",
+  "board_views_grey": "#6e6f8f",
+  "board_views_blue": "#1c1f3b",
+  "board_views_grey_hover": "#b2b3d0",
+  "board_views_blue_secondary": "#363a52",
+  "brand-blue": "#00a9ff",
   "brand-charcoal": "#2b2c5c",
-  "brand-gold": "#FFCC00",
-  "brand-green": "#11DD80",
-  "brand-iris": "#595AD4",
-  "brand-light-blue": "#00CFF4",
+  "brand-gold": "#ffcc00",
+  "brand-green": "#11dd80",
+  "brand-iris": "#595ad4",
+  "brand-light-blue": "#00cff4",
   "brand-malachite": "#00cd6f",
-  "brand-purple": "#A358D0",
-  "brand-red": "#F74875",
-  "public": "#009AFF",
+  "brand-purple": "#a358d0",
+  "brand-red": "#f74875",
+  "public": "#009aff",
   "private": "#f65f7c",
   "share": "#a358df",
   "word-blue": "#2a5699",
@@ -68,10 +68,10 @@
   "surface": "#292f4c",
   "burned_eggplant": "#181d37",
   "live_blue": "#009aff",
-  "extra_light_gray": "#EDEEF0",
+  "extra_light_gray": "#edeef0",
   "glitter": "#d9f0ff",
-  "ultra_light_gray": "#EBEBEB",
-  "red_shadow": "#e2445c",
+  "ultra_light_gray": "#ebebeb",
+  "red_shadow": "#df2f4a",
   "green_shadow": "#00c875",
   "wolf_gray": "#c5c7d0",
   "mud_black": "#323338",
@@ -80,40 +80,39 @@
   "jaco_gray": "#9699a6",
   "riverstone_gray": "#f5f6f8",
   "ui_grey": "#e6e9ef",
-  "border_light_gray": "#F5F6F8",
+  "border_light_gray": "#f5f6f8",
   "like_red": "#fb275d",
-  "lime_green": "#9CD326",
-  "lime-green": "#9CD326",
-  "mustered": "#CAB641",
-  "dark_red": "#BB3354",
-  "dark-red": "#BB3354",
-  "trolley-grey": "#808080",
-  "dark-purple": "#784BD1",
-  "dark-orange": "#FF642E",
-  "sofia_pink": "#FF158A",
-  "dark-pink": "#FF158A",
-  "turquoise": "#66CCFF",
-  "light-pink": "#FF5AC4",
-  "red-shadow": "#e2445c",
+  "lime_green": "#9cd326",
+  "lime-green": "#9cd326",
+  "mustered": "#cab641",
+  "dark_red": "#bb3354",
+  "dark-red": "#bb3354",
+  "trolley-grey": "#757575",
+  "dark-purple": "#784bd1",
+  "dark-orange": "#ff642e",
+  "sofia_pink": "#ff007f",
+  "dark-pink": "#ff007f",
+  "turquoise": "#66ccff",
+  "light-pink": "#ff5ac4",
+  "red-shadow": "#df2f4a",
   "orange": "#fdab3d",
   "yellow": "#ffcb00",
   "green-shadow": "#00c875",
   "grass-green": "#037f4c",
-  "blue-links": "#0086c0",
+  "blue-links": "#007eb5",
   "bright-blue": "#579bfc",
-  "amethyst": "#a25ddc",
+  "amethyst": "#9d50dd",
   "green-haze": "#00a359",
-  "sunset": "#FF7575",
-  "bubble": "#FAA1F1",
-  "peach": "#FFADAD",
-  "berry": "#7E3B8A",
-  "winter": "#9AADBD",
-  "river": "#68A1BD",
+  "sunset": "#ff7575",
+  "bubble": "#faa1f1",
+  "peach": "#ffadad",
+  "berry": "#7e3b8a",
+  "winter": "#9aadbd",
+  "river": "#74afcc",
   "navy": "#225091",
-  "aquamarine": "#4ECCC6",
-  "indigo": "#5559DF",
+  "aquamarine": "#4eccc6",
+  "indigo": "#5559df",
   "dark_indigo": "#401694",
   "asphalt": "#676879",
-  "higlight": "#DFF0FF",
-  "ui_grey": "#e6e9ef"
+  "higlight": "#dff0ff"
 }

packages/style/src/Themes/basic/_content-colors.scss

@@ -1,10 +1,10 @@
 @mixin define-theme-content-colors() {
-  // green grass
+  // Green Grass
   --color-grass_green: #037f4c;
   --color-grass_green-hover: #116846;
   --color-grass_green-selected: #81bfa5;
 
-  // done green
+  // Done Green
   --color-done-green: #00c875;
   --color-done-green-hover: #0f9b63;
   --color-done-green-selected: #80e3ba;
@@ -48,7 +48,7 @@
   --color-sunset-selected-with-opacity: rgba(255, 186, 186, 0.6);
 
   // Stuck red
-  --color-stuck-red: #e2445c;
+  --color-stuck-red: #df2f4a;
   --color-stuck-red-hover: #ad3f51;
   --color-stuck-red-selected: #f0a1ad;
 
@@ -58,7 +58,7 @@
   --color-dark-red-selected: #dd99a9;
 
   // Sofia
-  --color-sofia_pink: #ff158a;
+  --color-sofia_pink: #ff007f;
   --color-sofia_pink-hover: #c21e71;
   --color-sofia_pink-selected: #ff8ac4;
 
@@ -73,7 +73,7 @@
   --color-bubble-selected: #fcd0f8;
 
   // Purple
-  --color-purple: #a25ddc;
+  --color-purple: #9d50dd;
   --color-purple-hover: #8050ab;
   --color-purple-selected: #d0aeed;
 
@@ -108,7 +108,7 @@
   --color-bright-blue-selected: #abcdfd;
 
   // Dark blue
-  --color-dark-blue: #0086c0;
+  --color-dark-blue: #007eb5;
   --color-dark-blue-hover: #0f6d97;
   --color-dark-blue-selected: #80c2df;
 
@@ -123,11 +123,11 @@
   --color-chili-blue-selected: #b2e5ff;
 
   // River
-  --color-river: #68a1bd;
+  --color-river: #74afcc;
   --color-river-hover: #588095;
   --color-river-selected: #b3d0de;
 
-  // winter
+  // Winter
   --color-winter: #9aadbd;
   --color-winter-hover: #7b8895;
   --color-winter-selected: #ccd6de;
@@ -138,7 +138,7 @@
   --color-explosive-selected: #e1e1e1;
 
   // American Grey
-  --color-american_gray: #808080;
+  --color-american_gray: #757575;
   --color-american_gray-hover: #69696a;
   --color-american_gray-selected: #bfbfbf;
 
@@ -153,12 +153,12 @@
   --color-brown-selected: #bfa9a3;
 
   // Orchid
-  --color-orchid: #d974b0;
+  --color-orchid: #e484bd;
   --color-orchid-hover: #ae5d8d;
   --color-orchid-selected: #ecbad7;
 
   // Tan
-  --color-tan: #ad967a;
+  --color-tan: #bca58a;
   --color-tan-hover: #8a7862;
   --color-tan-selected: #d6cabc;
 
@@ -168,12 +168,12 @@
   --color-sky-selected: #d0f1fa;
 
   // Coffee
-  --color-coffee: #bd816e;
+  --color-coffee: #cd9282;
   --color-coffee-hover: #976758;
   --color-coffee-selected: #dec0b7;
 
   // Royal
-  --color-royal: #2b76e5;
+  --color-royal: #216edf;
   --color-royal-hover: #225eb7;
   --color-royal-selected: #95bbf2;
 

packages/style/src/config/tokens/themes/basic/palette/_palette.scss

@@ -20,7 +20,7 @@ $color-blood_red: #b63546;
 $color-pastel_red: #f4c3cb;
 $color-pinky_red: #ecb7bf;
 
-$color-purple: #a25ddc; // content color duplication
+$color-purple: #9d50dd; // content color duplication
 $color-bazooka: #f65f7c;
 
 $color-egg_yolk: #ffcb00; // warning colors

packages/style/src/config/tokens/themes/basic/palette/legacy/_legacy-pallete.scss

@@ -24,7 +24,7 @@ $color-ultra_light_gray: #ebebeb;
 $color-very_light_gray: #a1a1a1;
 $color-jaco_gray: #9699a6;
 $color-storm_gray: #6b6d77;
-$color-trolley-grey: #808080;
+$color-trolley-grey: #757575;
 $color-basic_light_blue: #c7e6fa;
 $color-light_blue: #61caf7;
 $color-turquoise: #66ccff;
@@ -33,7 +33,7 @@ $color-live_blue: #009aff;
 $color-jeans: #597bfc;
 $color-burned_eggplant: #181d37;
 $color-light-pink: #ff5ac4;
-$color-dark-pink: #ff158a;
+$color-dark-pink: #ff007f;
 $color-dark_red: #bb3354;
 $color-yellow: #ffcb00;
 $color-mustered: #cab641;
@@ -52,7 +52,7 @@ $color-dark-purple: #784bd1;
 //   we use the first one as an alias value and the other ones as aliases.
 //   -  We use custom properties as the values assignment.
 
-$color-blue_links: #0086c0;
+$color-blue_links: #007eb5;
 $color-blue-links-alias: $color-blue_links;
 $color-public: $color-live_blue;
 $color-private: $color-bazooka;
@@ -77,7 +77,7 @@ $color-form_purple: #575c96;
 $color-highlight: #dff0ff;
 $color-green_shadow: #00c875;
 $color-green-shadow-alias: $color-green_shadow;
-$color-red_shadow: #e2445c;
+$color-red_shadow: #df2f4a;
 $color-red-shadow-alias: $color-red_shadow;
 $color-like_red: #fb275d;
 $color-pulse_bg: #f0f0f0;