diff --git a/apps/web/src/components/editor/panels/timeline/timeline-element.tsx b/apps/web/src/components/editor/panels/timeline/timeline-element.tsx
index d5b8cade..9121f6c2 100644
--- a/apps/web/src/components/editor/panels/timeline/timeline-element.tsx
+++ b/apps/web/src/components/editor/panels/timeline/timeline-element.tsx
@@ -650,7 +650,7 @@ function EffectsButton({
 		<Button
 			variant="text"
 			size="icon"
-			className={cn("rounded-sm !size-5 bg-background/50", className)}
+			className={cn("rounded-sm !size-5 bg-black/50 text-white", className)}
 			onClick={handleClick}
 			onMouseDown={(event) => event.stopPropagation()}
 		>