diff --git a/src/components/Sidebar/AlgorithmSelector.tsx b/src/components/Sidebar/AlgorithmSelector.tsx
index dbcf28d..32b84e8 100644
--- a/src/components/Sidebar/AlgorithmSelector.tsx
+++ b/src/components/Sidebar/AlgorithmSelector.tsx
@@ -11,9 +11,9 @@ export const AlgorithmSelector = () => {
   const { activeAlgorithm, setActiveAlgorithm, isPlaying } = useStore();
 
   return (
-    <div className="flex flex-col gap-8">
+    <div className="flex flex-col gap-4">
       <Title title="Sorting Algorithms" />
-      <div className="flex flex-col gap-4">
+      <div className="flex flex-col gap-2">
         {algorithms.map((algorithm) => (
           <Button
             key={algorithm}
diff --git a/src/components/Sidebar/Sidebar.tsx b/src/components/Sidebar/Sidebar.tsx
index 8668d91..15d35b5 100644
--- a/src/components/Sidebar/Sidebar.tsx
+++ b/src/components/Sidebar/Sidebar.tsx
@@ -4,7 +4,7 @@ import { Settings } from "./Settings";
 
 export const Sidebar = () => (
   <aside className="hidden lg:flex min-w-[360px] p-8 flex-col justify-between border-accent/50 transition border-r-2 hover:border-accent">
-    <div className="flex flex-col h-full gap-16">
+    <div className="flex flex-col h-full gap-8">
       <AlgorithmSelector />
       <Settings />
     </div>