diff --git a/src/components/Assistant.vue b/src/components/Assistant.vue
index bb51ec82bfe..560368008c6 100644
--- a/src/components/Assistant.vue
+++ b/src/components/Assistant.vue
@@ -520,10 +520,10 @@ ul {
 }
 
 .icon-status--success {
-	color: var(--color-success);
+	color: var(--color-element-success);
 }
 
 .icon-status--failed {
-	color: var(--color-error);
+	color: var(--color-element-error);
 }
 </style>
diff --git a/src/nodes/Callout.vue b/src/nodes/Callout.vue
index f066768fcd2..4bff7cfe7a4 100644
--- a/src/nodes/Callout.vue
+++ b/src/nodes/Callout.vue
@@ -91,22 +91,22 @@ export default {
 	// Info (default) variables
 	&,
 	&--info {
-		--callout-border: var(--color-info, #006aa3);
+		--callout-border: var(--color-element-info, #006aa3);
 	}
 
 	// Warn variables
 	&--warn {
-		--callout-border: var(--color-warning);
+		--callout-border: var(--color-element-warning);
 	}
 
 	// Error variables
 	&--error {
-		--callout-border: var(--color-error);
+		--callout-border: var(--color-element-error);
 	}
 
 	// Success variables
 	&--success {
-		--callout-border: var(--color-success);
+		--callout-border: var(--color-element-success);
 	}
 }
 </style>