diff --git a/webapp/assets/_new/styles/tokens.scss b/webapp/assets/_new/styles/tokens.scss
index 863e0e0b7..f3e308573 100644
--- a/webapp/assets/_new/styles/tokens.scss
+++ b/webapp/assets/_new/styles/tokens.scss
@@ -11,6 +11,7 @@ $color-primary-inverse: rgb(241, 253, 244);
 $color-secondary: rgb(0, 142, 230);
 $color-secondary-active: rgb(10, 161, 255);
 $color-secondary-inverse: rgb(240, 249, 255);
+$color-third: rgb(149,74,255);
 $color-success: rgb(23, 181, 63);
 $color-success-active: rgb(26, 203, 71);
 $color-success-inverse: rgb(241, 253, 244);
diff --git a/webapp/components/Ribbon/index.vue b/webapp/components/Ribbon/index.vue
index ea7fd273a..89b84e817 100644
--- a/webapp/components/Ribbon/index.vue
+++ b/webapp/components/Ribbon/index.vue
@@ -48,10 +48,10 @@ export default {
   }
 }
 .eventBg {
-  background-color: $color-success-active;
+  background-color: $color-third;
 
   &::before {
-    border-color: $color-success-active transparent transparent $color-success-active;
+    border-color: $color-third transparent transparent $color-third;
   }
 }
 </style>