diff --git a/apps/frontend/components/Header.tsx b/apps/frontend/components/Header.tsx
new file mode 100644
index 00000000..f6641cbe
--- /dev/null
+++ b/apps/frontend/components/Header.tsx
@@ -0,0 +1,7 @@
+import React from 'react';
+
+const Header = () => {
+  return <h1>Securing Safe Food</h1>;
+};
+
+export default Header;
diff --git a/apps/frontend/src/containers/root.tsx b/apps/frontend/src/containers/root.tsx
index 05c220dc..cb8a0ea2 100644
--- a/apps/frontend/src/containers/root.tsx
+++ b/apps/frontend/src/containers/root.tsx
@@ -1,5 +1,12 @@
+import { Outlet } from 'react-router-dom';
+import Header from '../../components/Header';
 const Root: React.FC = () => {
-  return <>Welcome to scaffolding!</>;
+  return (
+    <div>
+      <Header />
+      <Outlet />
+    </div>
+  );
 };
 
 export default Root;