diff --git a/web/src/stream_list.ts b/web/src/stream_list.ts
index 15cae480ec..a627c52147 100644
--- a/web/src/stream_list.ts
+++ b/web/src/stream_list.ts
@@ -1149,7 +1149,7 @@ export let scroll_stream_into_view = function ($stream_li: JQuery): void {
         blueslip.error("Invalid stream_li was passed in");
         return;
     }
-    const stream_filter_height = $(".stream_search_section").outerHeight()!;
+    const stream_filter_height = $("#stream-search-and-add").outerHeight()!;
     const header_height = $stream_li
         .closest(".stream-list-section-container")
         .children(".stream-list-subsection-header")
diff --git a/web/styles/left_sidebar.css b/web/styles/left_sidebar.css
index 302f6d88b0..35ebbe8a0b 100644
--- a/web/styles/left_sidebar.css
+++ b/web/styles/left_sidebar.css
@@ -48,10 +48,17 @@
     margin-right: var(--left-sidebar-right-margin);
 }
 
-#streams_inline_icon {
-    color: var(--color-left-sidebar-heads-up-icon);
+.add-stream-icon-container {
+    grid-area: add-channel;
+    display: grid;
+    place-items: center center;
+    margin: 2px 0;
     border-radius: 3px;
 
+    .add_stream_icon {
+        color: var(--color-left-sidebar-heads-up-icon);
+    }
+
     &:hover {
         color: var(--color-left-sidebar-heads-up-icon-hover);
         background-color: var(
@@ -308,11 +315,19 @@
     }
 }
 
-.stream_search_section {
+.spectator-view #stream-search-and-add {
+    grid-template-columns: minmax(0, 1fr);
+}
+
+#stream-search-and-add {
+    display: grid;
+    grid-template-areas: "filter-container add-channel";
+    grid-template-columns: minmax(0, 1fr) var(--left-sidebar-header-icon-width);
     position: sticky;
     top: 0;
     /* Must be more than .stream-list-subsection-header */
     z-index: 3;
+    background: var(--color-background);
     /* Must be padding not margin so that the sticky headers don't show behind it */
     padding: var(--left-sidebar-sections-vertical-gutter)
         var(--left-sidebar-right-margin) 3px 5px;
@@ -1877,7 +1892,8 @@ li.topic-list-item {
         margin: 5px 0;
     }
 
-    .zoom-in-hide {
+    .zoom-in-hide,
+    #stream-search-and-add.zoom-in-hide {
         display: none;
     }
 
diff --git a/web/templates/left_sidebar.hbs b/web/templates/left_sidebar.hbs
index 82333b70c1..cda838c588 100644
--- a/web/templates/left_sidebar.hbs
+++ b/web/templates/left_sidebar.hbs
@@ -195,9 +195,14 @@
         </div>
 
         <div id="streams_list" class="zoom-out">
-            {{#> input_wrapper input_type="filter-input" custom_classes="stream_search_section" icon="search" input_button_icon="close"}}
-                <input type="text" class="input-element stream-list-filter home-page-input" autocomplete="off" placeholder="{{t 'Filter channels' }}" />
-            {{/input_wrapper}}
+            <div id="stream-search-and-add" class="zoom-in-hide">
+                {{#> input_wrapper input_type="filter-input" custom_classes="stream_search_section" icon="search" input_button_icon="close"}}
+                    <input type="text" class="input-element stream-list-filter home-page-input" autocomplete="off" placeholder="{{t 'Filter channels' }}" />
+                {{/input_wrapper}}
+                <span id="add_streams_tooltip" class="add-stream-icon-container hidden-for-spectators">
+                    <i id="streams_inline_icon" class="add_stream_icon zulip-icon zulip-icon-square-plus" aria-hidden="true" ></i>
+                </span>
+            </div>
             <div id="topics_header">
                 <a class="show-all-streams trigger-click-on-enter" tabindex="0">{{t 'Back to channels' }}</a> <span class="unread_count quiet-count"></span>
             </div>