diff --git a/packages/docusaurus-theme-classic/src/theme-classic.d.ts b/packages/docusaurus-theme-classic/src/theme-classic.d.ts
index 8cf475b8400c..3ffea59cfc4c 100644
--- a/packages/docusaurus-theme-classic/src/theme-classic.d.ts
+++ b/packages/docusaurus-theme-classic/src/theme-classic.d.ts
@@ -900,7 +900,7 @@ declare module '@theme/Navbar/Search' {
     readonly className?: string;
   }
 
-  export default function NavbarSearch(props: Props): JSX.Element;
+  export default function NavbarSearch(props: Props): JSX.Element | null;
 }
 
 declare module '@theme/NavbarItem/DefaultNavbarItem' {
@@ -1117,7 +1117,7 @@ declare module '@theme/PaginatorNavLink' {
 }
 
 declare module '@theme/SearchBar' {
-  export default function SearchBar(): JSX.Element;
+  export default function SearchBar(): JSX.Element | null;
 }
 
 declare module '@theme/TabItem' {
diff --git a/packages/docusaurus-theme-classic/src/theme/Navbar/Search/index.tsx b/packages/docusaurus-theme-classic/src/theme/Navbar/Search/index.tsx
index 236d237aa082..ac092a81e563 100644
--- a/packages/docusaurus-theme-classic/src/theme/Navbar/Search/index.tsx
+++ b/packages/docusaurus-theme-classic/src/theme/Navbar/Search/index.tsx
@@ -14,6 +14,9 @@ import styles from './styles.module.css';
 export default function NavbarSearch({
   children,
   className,
-}: Props): JSX.Element {
+}: Props): JSX.Element | null {
+  if ((children as any)?.type?.() === null) {
+    return null;
+  }
   return <div className={clsx(className, styles.searchBox)}>{children}</div>;
 }