diff --git a/example/src/App.tsx b/example/src/App.tsx
index fc6b80a..f787f3a 100644
--- a/example/src/App.tsx
+++ b/example/src/App.tsx
@@ -1,9 +1,12 @@
+import { useState } from "react";
 import { useGame } from "../../src/useGame";
 import { useKeyBindings } from "./useKeyBindings";
+import type { Difficulty } from "../../src/types";
 import '../../src/game.css';
 
 function App() {
-  const gameManager = useGame({ difficulty: 'medium' }, useKeyBindings);
+  const [difficulty, setDifficulty] = useState<Difficulty>('medium');
+  const gameManager = useGame({ difficulty }, useKeyBindings);
   const { containerRef, gameStatus, scoreManager } = gameManager;
   const { timeValue, keystrokes, finalScore } = scoreManager;
 
@@ -17,6 +20,50 @@ function App() {
   return (
     <div className="flex flex-col items-center justify-around min-h-[100vh]">
       <h1 className="text-6xl">VIMazing vim-sudoku example</h1>
+      
+      {gameStatus === "waiting" && (
+        <div className="mx-auto my-4 w-fit bg-muted rounded-lg p-4">
+          <div className="text-center mb-4">
+            <div className="text-muted-foreground mb-2">Select Difficulty</div>
+            <div className="flex gap-4 justify-center">
+              <label className="flex items-center gap-2 cursor-pointer">
+                <input
+                  type="radio"
+                  name="difficulty"
+                  value="easy"
+                  checked={difficulty === 'easy'}
+                  onChange={(e) => setDifficulty(e.target.value as Difficulty)}
+                  className="cursor-pointer"
+                />
+                <span>Easy</span>
+              </label>
+              <label className="flex items-center gap-2 cursor-pointer">
+                <input
+                  type="radio"
+                  name="difficulty"
+                  value="medium"
+                  checked={difficulty === 'medium'}
+                  onChange={(e) => setDifficulty(e.target.value as Difficulty)}
+                  className="cursor-pointer"
+                />
+                <span>Medium</span>
+              </label>
+              <label className="flex items-center gap-2 cursor-pointer">
+                <input
+                  type="radio"
+                  name="difficulty"
+                  value="hard"
+                  checked={difficulty === 'hard'}
+                  onChange={(e) => setDifficulty(e.target.value as Difficulty)}
+                  className="cursor-pointer"
+                />
+                <span>Hard</span>
+              </label>
+            </div>
+          </div>
+        </div>
+      )}
+
       <div className="mx-auto my-4 w-fit bg-muted rounded-lg p-4">
         {(gameStatus === "started" || gameStatus === "game-won") && (
           <div className="flex gap-8 text-sm font-mono items-center">
diff --git a/src/useGame.ts b/src/useGame.ts
index 941533d..4fe9c94 100644
--- a/src/useGame.ts
+++ b/src/useGame.ts
@@ -21,7 +21,7 @@ export function useGame(options: GameOptions = {}, platformHook?: unknown): Game
     } else if (gameStatus === 'waiting') {
       renderBoard();
     }
-  }, [gameStatus]);
+  }, [gameStatus, difficulty]);
 
   const gameManager: GameManager = {
     containerRef,