diff --git a/components/pages/Metadata.tsx b/components/pages/Metadata.tsx
new file mode 100644
index 00000000..95128d46
--- /dev/null
+++ b/components/pages/Metadata.tsx
@@ -0,0 +1,19 @@
+import Head from 'next/head';
+import {
+  description as packageDescription,
+  name as packageName
+} from 'package.json';
+import type { FC } from 'react';
+import type { MetadataProps } from 'types/components/pages/Metadata';
+
+const Metadata: FC<MetadataProps> = ({
+  description = packageDescription,
+  title = packageName
+}) => (
+  <Head>
+    <meta name="description" content={description} />
+    <title>{title}</title>
+  </Head>
+);
+
+export default Metadata;
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 747c4148..740c7ccc 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -1,16 +1,12 @@
+import Metadata from 'components/pages/Metadata';
 import StyledApp from 'components/pages/StyledApp';
 import type { AppProps } from 'next/app';
-import Head from 'next/head';
-import { description, name } from 'package.json';
 import type { ReactElement } from 'react';
 
 export default function App({ Component, pageProps }: AppProps): ReactElement {
   return (
     <>
-      <Head>
-        <title>{name}</title>
-        <meta name="description" content={description} />
-      </Head>
+      <Metadata />
       <StyledApp>
         <Component {...pageProps} />
       </StyledApp>
diff --git a/types/components/pages/Metadata.ts b/types/components/pages/Metadata.ts
new file mode 100644
index 00000000..64c47847
--- /dev/null
+++ b/types/components/pages/Metadata.ts
@@ -0,0 +1,4 @@
+export type MetadataProps = {
+  description?: string;
+  title?: string;
+};
