diff --git a/ui/src/components/template/HeaderLogo.tsx b/ui/src/components/template/HeaderLogo.tsx
index cf8955d1..737f3127 100644
--- a/ui/src/components/template/HeaderLogo.tsx
+++ b/ui/src/components/template/HeaderLogo.tsx
@@ -4,7 +4,7 @@ import { useStoreState } from '@/store'
 const HeaderLogo = () => {
   const mode = useStoreState((state) => state.theme.mode)
 
-  return <Logo mode={mode} className="hidden md:block" imgClass="w-9/12" />
+  return <Logo mode={mode} className="hidden xl:block" imgClass="w-9/12" />
 }
 
 export default HeaderLogo
diff --git a/ui/src/constants/theme.constant.ts b/ui/src/constants/theme.constant.ts
index aa576384..8dc414d1 100644
--- a/ui/src/constants/theme.constant.ts
+++ b/ui/src/constants/theme.constant.ts
@@ -19,7 +19,7 @@ export const SPLITTED_SIDE_NAV_MINI_WIDTH = 80
 export const SPLITTED_SIDE_NAV_SECONDARY_WIDTH = 250
 export const SIDE_NAV_CONTENT_GUTTER = 'px-4'
 export const LOGO_X_GUTTER = 'px-4'
-export const HEADER_HEIGHT_CLASS = 'h-14'
+export const HEADER_HEIGHT_CLASS = 'h-16'
 export const PAGE_CONTAINER_GUTTER_X = 'px-4 sm:px-6 md:px-8'
 export const PAGE_CONTAINER_GUTTER_Y = 'py-4 sm:py-6 md:px-8'