diff --git a/assets/themes/cave-dark.json b/assets/themes/cave-dark.json
index fb5b6314b10108f7aaf11d7d07068d2c26c0f512..8fe36aac5d567dc7fd8994769bbb63d9af5f0779 100644
--- a/assets/themes/cave-dark.json
+++ b/assets/themes/cave-dark.json
@@ -212,17 +212,43 @@
       "sidebar_item": {
         "height": 32,
         "icon_color": "#8b8792",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_hover": {
         "height": 32,
         "icon_color": "#8b8792",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_active": {
         "height": 32,
         "icon_color": "#efecf4",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5,
+        "background": "#5852607a"
+      },
+      "sidebar_items_left": {
+        "margin": {
+          "right": 20
+        }
+      },
+      "sidebar_items_right": {
+        "margin": {
+          "left": 20
+        }
       }
     },
     "titlebar": {
diff --git a/assets/themes/cave-light.json b/assets/themes/cave-light.json
index 32421648471e02a87b4746bcc95a0da82a5f2c6e..cdd23be45f0f9c05701e819467ca44373a8aeedf 100644
--- a/assets/themes/cave-light.json
+++ b/assets/themes/cave-light.json
@@ -212,17 +212,43 @@
       "sidebar_item": {
         "height": 32,
         "icon_color": "#585260",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_hover": {
         "height": 32,
         "icon_color": "#585260",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_active": {
         "height": 32,
         "icon_color": "#19171c",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5,
+        "background": "#8b87922e"
+      },
+      "sidebar_items_left": {
+        "margin": {
+          "right": 20
+        }
+      },
+      "sidebar_items_right": {
+        "margin": {
+          "left": 20
+        }
       }
     },
     "titlebar": {
diff --git a/assets/themes/dark.json b/assets/themes/dark.json
index 49f78bee1bfc23846bd24a2f574a8b31e1aa3942..9a0d6762e2c35d462aea5cb06c1466fa28841c03 100644
--- a/assets/themes/dark.json
+++ b/assets/themes/dark.json
@@ -212,17 +212,43 @@
       "sidebar_item": {
         "height": 32,
         "icon_color": "#9c9c9c",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_hover": {
         "height": 32,
         "icon_color": "#9c9c9c",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_active": {
         "height": 32,
         "icon_color": "#ffffff",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5,
+        "background": "#2b2b2b"
+      },
+      "sidebar_items_left": {
+        "margin": {
+          "right": 20
+        }
+      },
+      "sidebar_items_right": {
+        "margin": {
+          "left": 20
+        }
       }
     },
     "titlebar": {
diff --git a/assets/themes/light.json b/assets/themes/light.json
index 88fe8f5a914a8b18871fbf50b86aa1b02da41f78..6997cd2e680c8f5ac1b80e8f7a27862c5b017c7b 100644
--- a/assets/themes/light.json
+++ b/assets/themes/light.json
@@ -212,17 +212,43 @@
       "sidebar_item": {
         "height": 32,
         "icon_color": "#717171",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_hover": {
         "height": 32,
         "icon_color": "#717171",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_active": {
         "height": 32,
         "icon_color": "#000000",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5,
+        "background": "#e3e3e3"
+      },
+      "sidebar_items_left": {
+        "margin": {
+          "right": 20
+        }
+      },
+      "sidebar_items_right": {
+        "margin": {
+          "left": 20
+        }
       }
     },
     "titlebar": {
diff --git a/assets/themes/solarized-dark.json b/assets/themes/solarized-dark.json
index 7d53cce491c481d5b1eb6ce989f9855f42fa5945..b63a0f487245735a748e3b5a03678e47db337fa8 100644
--- a/assets/themes/solarized-dark.json
+++ b/assets/themes/solarized-dark.json
@@ -212,17 +212,43 @@
       "sidebar_item": {
         "height": 32,
         "icon_color": "#93a1a1",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_hover": {
         "height": 32,
         "icon_color": "#93a1a1",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_active": {
         "height": 32,
         "icon_color": "#fdf6e3",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5,
+        "background": "#586e757a"
+      },
+      "sidebar_items_left": {
+        "margin": {
+          "right": 20
+        }
+      },
+      "sidebar_items_right": {
+        "margin": {
+          "left": 20
+        }
       }
     },
     "titlebar": {
diff --git a/assets/themes/solarized-light.json b/assets/themes/solarized-light.json
index 167bf305cb0ac7915d5fa595a80056d6cbe78cec..2b0b1d5edd72482516b6d69558d0f53c551bb361 100644
--- a/assets/themes/solarized-light.json
+++ b/assets/themes/solarized-light.json
@@ -212,17 +212,43 @@
       "sidebar_item": {
         "height": 32,
         "icon_color": "#586e75",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_hover": {
         "height": 32,
         "icon_color": "#586e75",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_active": {
         "height": 32,
         "icon_color": "#002b36",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5,
+        "background": "#93a1a12e"
+      },
+      "sidebar_items_left": {
+        "margin": {
+          "right": 20
+        }
+      },
+      "sidebar_items_right": {
+        "margin": {
+          "left": 20
+        }
       }
     },
     "titlebar": {
diff --git a/assets/themes/sulphurpool-dark.json b/assets/themes/sulphurpool-dark.json
index db76b4502af2f27f2679ef05d07e4e6f4ba0c330..9ab07af2d1615bf937377cab7096b0a5144939fc 100644
--- a/assets/themes/sulphurpool-dark.json
+++ b/assets/themes/sulphurpool-dark.json
@@ -212,17 +212,43 @@
       "sidebar_item": {
         "height": 32,
         "icon_color": "#979db4",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_hover": {
         "height": 32,
         "icon_color": "#979db4",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_active": {
         "height": 32,
         "icon_color": "#f5f7ff",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5,
+        "background": "#5e66877a"
+      },
+      "sidebar_items_left": {
+        "margin": {
+          "right": 20
+        }
+      },
+      "sidebar_items_right": {
+        "margin": {
+          "left": 20
+        }
       }
     },
     "titlebar": {
diff --git a/assets/themes/sulphurpool-light.json b/assets/themes/sulphurpool-light.json
index 9957f42a6b5dd25a18d0415cef9310cabf055182..1a83d53fea1bb8f4dc811613b6360c338fc51726 100644
--- a/assets/themes/sulphurpool-light.json
+++ b/assets/themes/sulphurpool-light.json
@@ -212,17 +212,43 @@
       "sidebar_item": {
         "height": 32,
         "icon_color": "#5e6687",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_hover": {
         "height": 32,
         "icon_color": "#5e6687",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5
       },
       "sidebar_item_active": {
         "height": 32,
         "icon_color": "#202746",
-        "icon_size": 18
+        "icon_size": 18,
+        "padding": {
+          "left": 5,
+          "right": 5
+        },
+        "corner_radius": 5,
+        "background": "#979db42e"
+      },
+      "sidebar_items_left": {
+        "margin": {
+          "right": 20
+        }
+      },
+      "sidebar_items_right": {
+        "margin": {
+          "left": 20
+        }
       }
     },
     "titlebar": {
diff --git a/crates/theme/src/theme.rs b/crates/theme/src/theme.rs
index e8bf1a15533aefac0fc3fe6b66cadad6a635818c..710069d90d2d5f09cb5e4345d3661b91152507c6 100644
--- a/crates/theme/src/theme.rs
+++ b/crates/theme/src/theme.rs
@@ -136,20 +136,6 @@ pub struct FindEditor {
     pub max_width: f32,
 }
 
-#[derive(Deserialize, Default)]
-pub struct Sidebar {
-    pub resize_handle: ContainerStyle,
-}
-
-#[derive(Clone, Copy, Deserialize, Default)]
-pub struct SidebarItem {
-    #[serde(flatten)]
-    pub container: ContainerStyle,
-    pub icon_color: Color,
-    pub icon_size: f32,
-    pub height: f32,
-}
-
 #[derive(Deserialize, Default)]
 pub struct StatusBar {
     #[serde(flatten)]
@@ -161,11 +147,27 @@ pub struct StatusBar {
     pub lsp_message: TextStyle,
     pub auto_update_progress_message: TextStyle,
     pub auto_update_done_message: TextStyle,
+    pub sidebar_items_left: ContainerStyle,
+    pub sidebar_items_right: ContainerStyle,
     pub sidebar_item: SidebarItem,
     pub sidebar_item_active: SidebarItem,
     pub sidebar_item_hover: SidebarItem,
 }
 
+#[derive(Deserialize, Default)]
+pub struct Sidebar {
+    pub resize_handle: ContainerStyle,
+}
+
+#[derive(Clone, Copy, Deserialize, Default)]
+pub struct SidebarItem {
+    #[serde(flatten)]
+    pub container: ContainerStyle,
+    pub icon_color: Color,
+    pub icon_size: f32,
+    pub height: f32,
+}
+
 #[derive(Deserialize, Default)]
 pub struct ChatPanel {
     #[serde(flatten)]
diff --git a/crates/workspace/src/sidebar.rs b/crates/workspace/src/sidebar.rs
index 58d4bc6afcf010598b910a0a16d318fee77dab47..d0b786ea2d53e65ca2a5ec0dc109030fae51ff47 100644
--- a/crates/workspace/src/sidebar.rs
+++ b/crates/workspace/src/sidebar.rs
@@ -176,22 +176,26 @@ impl View for SidebarButtons {
 
     fn render(&mut self, cx: &mut RenderContext<Self>) -> ElementBox {
         let theme = &cx.global::<Settings>().theme.workspace.status_bar;
-        let style = theme.sidebar_item;
-        let hover_style = theme.sidebar_item_hover;
-        let active_style = theme.sidebar_item_active;
         let sidebar = self.sidebar.read(cx);
+        let item_style = theme.sidebar_item;
+        let hover_item_style = theme.sidebar_item_hover;
+        let active_item_style = theme.sidebar_item_active;
         let active_ix = sidebar.active_item_ix;
         let side = sidebar.side;
+        let group_style = match side {
+            Side::Left => theme.sidebar_items_left,
+            Side::Right => theme.sidebar_items_right,
+        };
         let items = sidebar.items.clone();
         Flex::row()
             .with_children(items.iter().enumerate().map(|(ix, item)| {
                 MouseEventHandler::new::<Self, _, _>(ix, cx, move |state, _| {
                     let style = if Some(ix) == active_ix {
-                        active_style
+                        active_item_style
                     } else if state.hovered {
-                        hover_style
+                        hover_item_style
                     } else {
-                        style
+                        item_style
                     };
                     Svg::new(item.icon_path)
                         .with_color(style.icon_color)
@@ -210,6 +214,8 @@ impl View for SidebarButtons {
                 })
                 .boxed()
             }))
+            .contained()
+            .with_style(group_style)
             .boxed()
     }
 }
diff --git a/styles/src/styleTree/workspace.ts b/styles/src/styleTree/workspace.ts
index a960f9508dc69b339659c9bcfa6ed69f78902e9a..ce1bc05a81af0fb2181dcce7e8201e11913cdf95 100644
--- a/styles/src/styleTree/workspace.ts
+++ b/styles/src/styleTree/workspace.ts
@@ -51,6 +51,8 @@ export default function workspace(theme: Theme) {
     height: 32,
     iconColor: iconColor(theme, "secondary"),
     iconSize: 18,
+    padding: { left: 5, right: 5 },
+    cornerRadius: 5,
   };
   const shareIcon = {
     margin: { top: 3, bottom: 2 },
@@ -102,7 +104,14 @@ export default function workspace(theme: Theme) {
       sidebarItemActive: {
         ...sidebarItem,
         iconColor: iconColor(theme, "active"),
+        background: backgroundColor(theme, 300, "active"),
       },
+      sidebarItemsLeft: {
+        margin: { right: 20 }
+      },
+      sidebarItemsRight: {
+        margin: { left: 20 }
+      }
     },
     titlebar: {
       avatarWidth: 18,