diff --git a/erpnext/www/support/index.html b/erpnext/www/support/index.html
index 93da503dbb0..12b4c2c0819 100644
--- a/erpnext/www/support/index.html
+++ b/erpnext/www/support/index.html
@@ -9,6 +9,33 @@
 			<p class="hero-subtitle">{{ greeting_subtitle }}</p>
 			{% endif %}
 		</div>
+		<div class="search-container">
+			<div class="website-search" id="search-container">
+				<div class="dropdown">
+					<div class="search-icon">
+						<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"
+							fill="none"
+							stroke="currentColor" stroke-width="2" stroke-linecap="round"
+							stroke-linejoin="round"
+							class="feather feather-search">
+							<circle cx="11" cy="11" r="8"></circle>
+							<line x1="21" y1="21" x2="16.65" y2="16.65"></line>
+						</svg>
+					</div>
+					<input type="search" class="form-control" placeholder="Search the docs (Press ? to focus)" />
+					<div class="overflow-hidden shadow dropdown-menu w-100">
+					</div>
+				</div>
+			</div>
+			<button class="navbar-toggler" type="button"
+				data-toggle="collapse"
+				data-target="#navbarSupportedContent"
+				aria-controls="navbarSupportedContent"
+				aria-expanded="false"
+				aria-label="Toggle navigation">
+				<span class="navbar-toggler-icon"></span>
+			</button>
+		</div>
 	</div>
 </section>
 
@@ -54,5 +81,21 @@
 	</div>
 </section>
 {% endif %}
+{% endblock %}
 
-{% endblock %}
\ No newline at end of file
+{%- block script -%}
+<script>
+	frappe.ready(() => {
+		frappe.setup_search('#search-container', 'kb');
+	});
+</script>
+{%- endblock -%}
+
+{%- block style -%}
+<style>
+	.search-container {
+		margin-top: 1.2rem;
+		max-width: 500px;
+	}	
+</style>
+{%- endblock -%}