diff --git a/app/components/Settings/BottomScreen/Menus/TouchScreen/TapTap.vue b/app/components/Settings/BottomScreen/Menus/TouchScreen/TapTap.vue
index d1c5828..114bac3 100644
--- a/app/components/Settings/BottomScreen/Menus/TouchScreen/TapTap.vue
+++ b/app/components/Settings/BottomScreen/Menus/TouchScreen/TapTap.vue
@@ -2,6 +2,7 @@
 import { useLocalStorage } from "@vueuse/core";
 import gsap from "gsap";
 
+const app = useAppStore();
 const store = useSettingsStore();
 const achievements = useAchievementsStore();
 const confirmationModal = useConfirmationModal();
@@ -344,7 +345,7 @@ onRender((ctx) => {
     // draw circles and rings
     for (const circle of circles) {
       ctx.globalAlpha = animation.circlesOpacity;
-      ctx.fillStyle = "#fb0000";
+      ctx.fillStyle = app.color.hex;
       fillCirclePixelated(ctx, circle.x, circle.y, circle.radius);
 
       ctx.fillStyle = "#fbfafa";
@@ -353,7 +354,7 @@ onRender((ctx) => {
 
     for (const ring of rings) {
       ctx.globalAlpha = ring.alpha * animation.circlesOpacity;
-      ctx.fillStyle = "#fb0000";
+      ctx.fillStyle = app.color.hex;
       strokeCirclePixelated(
         ctx,
         ring.x,