diff --git a/site/src/components/page-head.js b/site/src/components/page-head.js
new file mode 100644
index 00000000..49f5382d
--- /dev/null
+++ b/site/src/components/page-head.js
@@ -0,0 +1,12 @@
+import React from 'react';
+
+function PageHead({ title, children }) {
+  return (
+    <>
+      <title>{title} | Morgan Stanley</title>
+      {children}
+    </>
+  );
+}
+
+export default PageHead;
diff --git a/site/src/pages/404.js b/site/src/pages/404.js
index f65073c4..8bb6d371 100644
--- a/site/src/pages/404.js
+++ b/site/src/pages/404.js
@@ -3,6 +3,7 @@ import { graphql } from 'gatsby';
 
 import Hero from '../components/hero';
 import Layout from '../components/layout';
+import PageHead from '../components/page-head';
 
 const NotFoundPage = ({ data, location }) => {
   return (
@@ -18,7 +19,10 @@ const NotFoundPage = ({ data, location }) => {
 
 export default NotFoundPage;
 
-export const Head = () => <title>404: Not Found</title>;
+export const Head = ({ data }) => {
+  const title = `404: Not Found | ${data.site.siteMetadata.title}`;
+  return <PageHead title={title} />;
+};
 
 export const pageQuery = graphql`
   query {
diff --git a/site/src/pages/documentation/index.js b/site/src/pages/documentation/index.js
index 827bead6..5e85edb8 100644
--- a/site/src/pages/documentation/index.js
+++ b/site/src/pages/documentation/index.js
@@ -1,13 +1,14 @@
 import React, { useCallback, useState } from 'react';
 import { Link, graphql } from 'gatsby';
 import Box from '@mui/material/Box';
+import Toolbar from '@mui/material/Toolbar';
 
+import PageHead from '../../components/page-head';
 import Layout from '../../components/layout';
 import VersionSelect from '../../components/version-select';
 import { getDocsVersion } from '../../utils/version-docs';
 
 import HeroContent from '../../../content/hero.mdx';
-import { Toolbar } from '@mui/material';
 
 const DocumentationIndex = ({ data, location }) => {
   const allDocs = data.allMdx.nodes;
@@ -66,7 +67,10 @@ const DocumentationIndex = ({ data, location }) => {
 
 export default DocumentationIndex;
 
-export const Head = () => <title>Documentation</title>;
+export const Head = ({ data }) => {
+  const title = `Documentation | ${data.site.siteMetadata.title}`;
+  return <PageHead title={title} />;
+};
 
 export const pageQuery = graphql`
   query {
diff --git a/site/src/pages/index.js b/site/src/pages/index.js
index 2fa67287..7fe701a0 100644
--- a/site/src/pages/index.js
+++ b/site/src/pages/index.js
@@ -8,6 +8,7 @@ import HeroContent from '../../content/hero.mdx';
 import UseCases from '../../content/use-cases.mdx';
 
 import Article from '../components/article';
+import PageHead from '../components/page-head';
 import Layout from '../components/layout';
 
 const SiteIndex = ({ data, location }) => {
@@ -34,6 +35,10 @@ const SiteIndex = ({ data, location }) => {
   );
 };
 
+export const Head = ({ data }) => (
+  <PageHead title={data.site.siteMetadata.title} />
+);
+
 export default SiteIndex;
 
 export const pageQuery = graphql`
diff --git a/site/src/pages/news/index.js b/site/src/pages/news/index.js
index 888966ac..a4a9269c 100644
--- a/site/src/pages/news/index.js
+++ b/site/src/pages/news/index.js
@@ -2,6 +2,7 @@ import React from 'react';
 import { Link, graphql } from 'gatsby';
 
 import Layout from '../../components/layout';
+import PageHead from '../../components/page-head';
 
 import HeroContent from '../../../content/hero.mdx';
 
@@ -32,7 +33,9 @@ const NewsIndex = ({ data, location }) => {
 
 export default NewsIndex;
 
-export const Head = () => <title>News</title>;
+export const Head = ({ data }) => (
+  <PageHead title={data.site.siteMetadata.title} />
+);
 
 export const pageQuery = graphql`
   query {
diff --git a/site/src/templates/documentation.js b/site/src/templates/documentation.js
index 381c9efc..ac1ceb79 100644
--- a/site/src/templates/documentation.js
+++ b/site/src/templates/documentation.js
@@ -3,6 +3,7 @@ import { Link, navigate, graphql } from 'gatsby';
 import { Box } from '@mui/material';
 
 import Layout from '../components/layout';
+import PageHead from '../components/page-head';
 import VersionSelect from '../components/version-select';
 import { getCurrentVersion, getDocsVersion } from '../utils/version-docs';
 
@@ -83,12 +84,14 @@ const DocumentationTemplate = ({ children, data, pageContext, location }) => {
 
 export default DocumentationTemplate;
 
-export const Head = ({ pageContext }) => (
-  <>
-    <title>{pageContext.frontmatter.title}</title>
-    <meta name="description" content={pageContext.description} />
-  </>
-);
+export const Head = ({ data, pageContext }) => {
+  const title = `${pageContext.frontmatter.title} | ${data.site.siteMetadata.title}`;
+  return (
+    <PageHead title={title}>
+      <meta name="description" content={pageContext.description} />
+    </PageHead>
+  );
+};
 
 export const pageQuery = graphql`
   query ($id: String!) {
diff --git a/site/src/templates/news.js b/site/src/templates/news.js
index 05624b3d..ed0af4f1 100644
--- a/site/src/templates/news.js
+++ b/site/src/templates/news.js
@@ -2,6 +2,7 @@ import React from 'react';
 import { graphql } from 'gatsby';
 
 import Layout from '../components/layout';
+import PageHead from '../components/page-head';
 import Section from '../components/section';
 
 const NewsPostTemplate = ({ children, data, pageContext, location }) => {
@@ -24,12 +25,14 @@ const NewsPostTemplate = ({ children, data, pageContext, location }) => {
 
 export default NewsPostTemplate;
 
-export const Head = ({ pageContext }) => (
-  <>
-    <title>{pageContext.title}</title>
-    <meta name="description" content={pageContext.description} />
-  </>
-);
+export const Head = ({ data, pageContext }) => {
+  const title = `${pageContext.frontmatter.title} | ${data.site.siteMetadata.title}`;
+  return (
+    <PageHead title={title}>
+      <meta name="description" content={pageContext.description} />
+    </PageHead>
+  );
+};
 
 export const pageQuery = graphql`
   query ($id: String!) {
diff --git a/site/src/templates/page.js b/site/src/templates/page.js
index bac4bd7c..51a0f49b 100644
--- a/site/src/templates/page.js
+++ b/site/src/templates/page.js
@@ -2,6 +2,7 @@ import React from 'react';
 import { graphql } from 'gatsby';
 
 import Layout from '../components/layout';
+import PageHead from '../components/page-head';
 
 const PageTemplate = ({ title, data, location, children }) => {
   return (
@@ -18,12 +19,14 @@ const PageTemplate = ({ title, data, location, children }) => {
 
 export default PageTemplate;
 
-export const Head = ({ pageContext }) => (
-  <>
-    <title>{pageContext.title}</title>
-    <meta name="description" content={pageContext.description} />
-  </>
-);
+export const Head = ({ data, pageContext }) => {
+  const title = `${pageContext.frontmatter.title} | ${data.site.siteMetadata.title}`;
+  return (
+    <PageHead title={title}>
+      <meta name="description" content={pageContext.description} />
+    </PageHead>
+  );
+};
 
 export const pageQuery = graphql`
   query ($id: String!) {