diff --git a/app/citizen-frontend/src/pages/introduction.vue b/app/citizen-frontend/src/pages/introduction.vue
index d7b3fa6..b198bdd 100644
--- a/app/citizen-frontend/src/pages/introduction.vue
+++ b/app/citizen-frontend/src/pages/introduction.vue
@@ -55,7 +55,7 @@ const slides = [
 
         <v-carousel
           class="introduction-carousel"
-          color="accent"
+          color="secondary"
           delimiter-icon="mdi-square"
           hide-delimiter-background
           show-arrows="hover"
@@ -89,4 +89,15 @@ const slides = [
   object-fit: contain;
   object-position: center;
 }
+
+.introduction-carousel :deep(.v-carousel__controls__item .v-icon) {
+  color: rgb(var(--v-theme-accent)) !important;
+  opacity: 1;
+}
+
+.introduction-carousel :deep(.v-carousel__controls__item.v-btn--active .v-icon),
+.introduction-carousel :deep(.v-carousel__controls__item--active .v-icon) {
+  color: rgb(var(--v-theme-secondary)) !important;
+  opacity: 1;
+}
 </style>