diff --git a/src/animation/PitAnimator.ts b/src/animation/PitAnimator.ts
index 4db6dc3..ffcdf84 100644
--- a/src/animation/PitAnimator.ts
+++ b/src/animation/PitAnimator.ts
@@ -13,6 +13,7 @@ import { Context } from "../context/context";
 import BoardViewModelFactory from "../factory/BoardViewModelFactory";
 import { PitViewModelFactory } from "../factory/PitViewModelFactory";
 import { Game } from "../models/Game";
+import { Theme } from "../theme/Theme";
 import { getColorByBrightness } from "../util/ColorUtil";
 import BoardViewModel from "../viewmodel/BoardViewModel";
 
@@ -35,6 +36,7 @@ export default class PitAnimator {
   ) {
     this.context = context;
     this.onBoardViewModelUpdate = onBoardViewModelUpdate;
+    this.context.themeManager.on("themechange", this.onThemeChange.bind(this));
   }
 
   get mancalaGame(): MancalaGame | undefined {
@@ -190,6 +192,11 @@ export default class PitAnimator {
     });
   }
 
+  private onThemeChange(theme: Theme){
+    if(!this.game) return;
+    this.onBoardViewModelUpdate?.(this.getBoardViewModelFromGame(this.game));
+  }
+
   public resetAnimationState() {
     this.animationIndex = -1;
     this.currentHistoryItem = undefined;
@@ -204,6 +211,7 @@ export default class PitAnimator {
   }
 
   public dispose() {
+    this.context.themeManager.off("themechange", this.onThemeChange.bind(this));
     this.resetAnimationState();
     this.clearCurrentInterval();
   }