diff --git a/beginner-gain-client/public/favicon.ico b/beginner-gain-client/public/favicon.ico
new file mode 100644
index 0000000000..b14d3797ff
Binary files /dev/null and b/beginner-gain-client/public/favicon.ico differ
diff --git a/beginner-gain-client/src/pages/_app.tsx b/beginner-gain-client/src/pages/_app.tsx
index 1b1785e993..808a308b82 100644
--- a/beginner-gain-client/src/pages/_app.tsx
+++ b/beginner-gain-client/src/pages/_app.tsx
@@ -4,12 +4,14 @@ import ComponentWrapper from "@/components/layout/ComponentWrapper";
 import {useState} from "react";
 import {Hydrate, QueryClient, QueryClientProvider} from "react-query";
 import {RecoilRoot, RecoilEnv} from "recoil";
+import Head from 'next/head';
 
 RecoilEnv.RECOIL_DUPLICATE_ATOM_KEY_CHECKING_ENABLED = false
 
 const App = ({ Component, pageProps }: AppProps) => {
   const [queryClient] = useState(()=> new QueryClient());
   return <>
+    <link rel="icon" href="/favicon.ico" sizes="any" />
     <QueryClientProvider client={queryClient}>
       <Hydrate state={pageProps.dehydrateState}>
         <RecoilRoot>