diff --git a/apps/web/src/components/editor/panels/timeline/timeline-toolbar.tsx b/apps/web/src/components/editor/panels/timeline/timeline-toolbar.tsx
index fc038d7a..f398264c 100644
--- a/apps/web/src/components/editor/panels/timeline/timeline-toolbar.tsx
+++ b/apps/web/src/components/editor/panels/timeline/timeline-toolbar.tsx
@@ -37,6 +37,7 @@ import {
Chart03Icon,
} from "@hugeicons/core-free-icons";
import { HugeiconsIcon } from "@hugeicons/react";
+import { OcRippleIcon } from "@/components/icons";
export function TimelineToolbar({
zoomLevel,
@@ -216,7 +217,7 @@ function ToolbarRightSection({
/>
}
+ icon={}
isActive={rippleEditingEnabled}
tooltip="Ripple editing"
onClick={() => toggleRippleEditing()}
diff --git a/apps/web/src/components/icons/ui.tsx b/apps/web/src/components/icons/ui.tsx
index e5ba731e..e5787027 100644
--- a/apps/web/src/components/icons/ui.tsx
+++ b/apps/web/src/components/icons/ui.tsx
@@ -354,3 +354,51 @@ export function OcSquarePlusIcon({
);
}
+export function OcRippleIcon({
+ className = "",
+ size = 24,
+ strokeWidth = 1.5,
+}: IconProps) {
+ return (
+
+ );
+}
+