diff --git a/src/components/object-position-control.tsx b/src/components/object-position-control.tsx
index 023fa0c..d67cee1 100644
--- a/src/components/object-position-control.tsx
+++ b/src/components/object-position-control.tsx
@@ -39,9 +39,12 @@ export function ObjectPositionControl({ value, onChange }: ObjectPositionControl
           )}
           aria-label={`Set object position to ${pos.replace(' ', ' ')}`}
         >
-          {value === pos && (
-            <div className="w-2 h-2 rounded-full bg-primary ring-1 ring-primary-foreground" />
-          )}
+          <div
+            className={cn(
+              "w-2 h-2 rounded-full transition-colors",
+              value === pos ? "bg-primary ring-1 ring-primary-foreground" : "bg-muted-foreground/20"
+            )}
+          />
         </button>
       ))}
     </div>