diff --git a/ui/src/frontend/track_panel.ts b/ui/src/frontend/track_panel.ts
index b21cef1be6..29cde7778b 100644
--- a/ui/src/frontend/track_panel.ts
+++ b/ui/src/frontend/track_panel.ts
@@ -141,7 +141,24 @@ class TrackShell implements m.ClassComponent<TrackShellAttrs> {
           ...this.getTrackShellButtons(attrs),
           attrs.track.getContextMenu(),
           m(TrackButton, {
-            action: () => {
+            action: (e) => {
+              // Scroll timeline by height of toggledPinnedTrack
+              const toBePinned =
+                !globals.state.pinnedTracks.includes(attrs.trackState.id);
+              if (e.currentTarget && e.currentTarget instanceof Element) {
+                const trackShell = e.currentTarget.closest('.track-shell');
+                if (trackShell) {
+                  let toScroll = trackShell.clientHeight;
+                  if (!toBePinned) {
+                    toScroll *= -1;
+                  }
+                  const parentScrollPanel = trackShell.closest('.scrolling-panel-container');
+                  if (parentScrollPanel) {
+                    parentScrollPanel.scroll(0,
+                      parentScrollPanel.scrollTop + toScroll);
+                  }
+                }
+              }
               globals.dispatch(
                   Actions.toggleTrackPinned({trackId: attrs.trackState.id}));
             },