diff --git a/src/plugins/home/public/application/components/__snapshots__/home.test.js.snap b/src/plugins/home/public/application/components/__snapshots__/home.test.js.snap
index 8f2bd4c306623..d00003a071b10 100644
--- a/src/plugins/home/public/application/components/__snapshots__/home.test.js.snap
+++ b/src/plugins/home/public/application/components/__snapshots__/home.test.js.snap
@@ -2,37 +2,22 @@
 
 exports[`home change home route should render a link to change the default route in advanced settings if advanced settings is enabled 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -56,7 +41,7 @@ exports[`home change home route should render a link to change the default route
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -65,37 +50,22 @@ exports[`home change home route should render a link to change the default route
 
 exports[`home directories should not render directory entry when showOnHomePage is false 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -119,7 +89,7 @@ exports[`home directories should not render directory entry when showOnHomePage
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -128,37 +98,22 @@ exports[`home directories should not render directory entry when showOnHomePage
 
 exports[`home directories should render ADMIN directory entry in "Manage your data" panel 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -194,7 +149,7 @@ exports[`home directories should render ADMIN directory entry in "Manage your da
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -203,37 +158,22 @@ exports[`home directories should render ADMIN directory entry in "Manage your da
 
 exports[`home directories should render DATA directory entry in "Ingest your data" panel 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -269,7 +209,7 @@ exports[`home directories should render DATA directory entry in "Ingest your dat
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -278,37 +218,22 @@ exports[`home directories should render DATA directory entry in "Ingest your dat
 
 exports[`home directories should render solutions in the "solution section" 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--hasSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={4}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -384,7 +309,7 @@ exports[`home directories should render solutions in the "solution section" 1`]
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -393,37 +318,22 @@ exports[`home directories should render solutions in the "solution section" 1`]
 
 exports[`home header render 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -447,7 +357,7 @@ exports[`home header render 1`] = `
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -456,37 +366,22 @@ exports[`home header render 1`] = `
 
 exports[`home header should show "Dev tools" link if console is available 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -522,7 +417,7 @@ exports[`home header should show "Dev tools" link if console is available 1`] =
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -531,37 +426,22 @@ exports[`home header should show "Dev tools" link if console is available 1`] =
 
 exports[`home header should show "Manage" link if stack management is available 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -585,7 +465,7 @@ exports[`home header should show "Manage" link if stack management is available
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -594,37 +474,22 @@ exports[`home header should show "Manage" link if stack management is available
 
 exports[`home isNewKibanaInstance should safely handle execeptions 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -648,7 +513,7 @@ exports[`home isNewKibanaInstance should safely handle execeptions 1`] = `
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -657,37 +522,22 @@ exports[`home isNewKibanaInstance should safely handle execeptions 1`] = `
 
 exports[`home isNewKibanaInstance should set isNewKibanaInstance to false when there are index patterns 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -711,7 +561,7 @@ exports[`home isNewKibanaInstance should set isNewKibanaInstance to false when t
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -720,37 +570,22 @@ exports[`home isNewKibanaInstance should set isNewKibanaInstance to false when t
 
 exports[`home isNewKibanaInstance should set isNewKibanaInstance to true when there are no index patterns 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -774,7 +609,7 @@ exports[`home isNewKibanaInstance should set isNewKibanaInstance to true when th
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -783,37 +618,22 @@ exports[`home isNewKibanaInstance should set isNewKibanaInstance to true when th
 
 exports[`home should render home component 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -837,7 +657,7 @@ exports[`home should render home component 1`] = `
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -846,37 +666,22 @@ exports[`home should render home component 1`] = `
 
 exports[`home welcome should show the normal home page if loading fails 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -900,7 +705,7 @@ exports[`home welcome should show the normal home page if loading fails 1`] = `
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -909,37 +714,22 @@ exports[`home welcome should show the normal home page if loading fails 1`] = `
 
 exports[`home welcome should show the normal home page if welcome screen is disabled locally 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -963,7 +753,7 @@ exports[`home welcome should show the normal home page if welcome screen is disa
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
@@ -979,37 +769,22 @@ exports[`home welcome should show the welcome screen if enabled, and there are n
 
 exports[`home welcome stores skip welcome setting if skipped 1`] = `
 <main
-  aria-labelledby="homHeader__title"
+  aria-labelledby="pageHeader__title"
   className="homWrapper"
   data-test-subj="homeApp"
 >
-  <header
-    className="homHeader homHeader--noSolutions"
-  >
-    <div
-      className="homHeader__inner"
-    >
-      <OverviewHeader
-        showDevToolsLink={true}
-        showManagementLink={true}
-        title={
-          <EuiTitle
-            size="m"
-          >
-            <h1
-              id="homHeader__title"
-            >
-              <FormattedMessage
-                defaultMessage="Home"
-                id="home.header.title"
-                values={Object {}}
-              />
-            </h1>
-          </EuiTitle>
-        }
+  <PageHeader
+    overlap={0}
+    showDevToolsLink={true}
+    showManagementLink={true}
+    title={
+      <FormattedMessage
+        defaultMessage="Home"
+        id="home.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="homContent"
   >
@@ -1033,7 +808,7 @@ exports[`home welcome stores skip welcome setting if skipped 1`] = `
       aria-hidden="true"
       margin="xl"
     />
-    <OverviewFooter
+    <PageFooter
       path="/app/home"
     />
   </div>
diff --git a/src/plugins/home/public/application/components/__snapshots__/synopsis.test.js.snap b/src/plugins/home/public/application/components/__snapshots__/synopsis.test.js.snap
index 190985f70659d..ec192ce1eb32f 100644
--- a/src/plugins/home/public/application/components/__snapshots__/synopsis.test.js.snap
+++ b/src/plugins/home/public/application/components/__snapshots__/synopsis.test.js.snap
@@ -9,6 +9,7 @@ exports[`props iconType 1`] = `
   href="link_to_item"
   icon={
     <EuiIcon
+      color="text"
       size="l"
       title=""
       type="logoApache"
diff --git a/src/plugins/home/public/application/components/_add_data.scss b/src/plugins/home/public/application/components/_add_data.scss
index 655c4742bcf5a..c405416eca770 100644
--- a/src/plugins/home/public/application/components/_add_data.scss
+++ b/src/plugins/home/public/application/components/_add_data.scss
@@ -17,17 +17,7 @@
  * under the License.
  */
 
-.homDataAdd__actions {
-  // Prevent children from rendering as flex items
-  display: block;
-
-  // Accounting for no `flush="both"` prop on EuiButtonEmpty
-  .euiButtonEmpty__content {
-    padding-left: 0;
-    padding-right: 0;
-  }
-}
-
-.homDataAdd__content .euiIcon__fillSecondary {
-  fill: $euiColorDarkestShade;
+// Accounting for no `flush="both"` prop on EuiButtonEmpty
+.homDataAdd__actionButton {
+  margin-right: 0;
 }
diff --git a/src/plugins/home/public/application/components/_home.scss b/src/plugins/home/public/application/components/_home.scss
index bab34a7b08946..0a4b42863bbd8 100644
--- a/src/plugins/home/public/application/components/_home.scss
+++ b/src/plugins/home/public/application/components/_home.scss
@@ -17,9 +17,6 @@
  * under the License.
  */
 
-// Local page variables
-$homePageWidth: 1200px;
-
 .homWrapper {
   background-color: $euiColorEmptyShade;
   display: flex;
@@ -27,30 +24,9 @@ $homePageWidth: 1200px;
   min-height: calc(100vh - #{$euiHeaderHeightCompensation});
 }
 
-.homHeader {
-  background-color: $euiPageBackgroundColor;
-  border-bottom: $euiBorderWidthThin solid $euiColorLightShade;
-
-  .homHeader__inner {
-    margin: 0 auto;
-    max-width: $homePageWidth;
-    padding: $euiSizeXL $euiSize;
-
-    .homHeader--hasSolutions & {
-      padding-bottom: $euiSizeXL + $euiSizeL;
-    }
-  }
-
-  // Accounting for no `flush="both"` prop on EuiButtonEmpty
-  .homHeader__actionItem .euiButtonEmpty__content {
-    padding-left: 0;
-    padding-right: 0;
-  }
-}
-
 .homContent {
   margin: 0 auto;
-  max-width: $homePageWidth;
+  max-width: 1200px;
   padding: $euiSizeXL $euiSize;
   width: 100%;
 }
@@ -64,16 +40,3 @@ $homePageWidth: 1200px;
     margin-top: 0 !important;
   }
 }
-
-.homFooter {
-  // Prevent children from rendering as flex items
-  .euiFlexItem {
-    display: block;
-  }
-
-  // Accounting for no `flush="both"` prop on EuiButtonEmpty
-  .euiButtonEmpty__content {
-    padding-left: 0;
-    padding-right: 0;
-  }
-}
diff --git a/src/plugins/home/public/application/components/_index.scss b/src/plugins/home/public/application/components/_index.scss
index a0547a4588561..5e2f58c7ebefa 100644
--- a/src/plugins/home/public/application/components/_index.scss
+++ b/src/plugins/home/public/application/components/_index.scss
@@ -7,7 +7,6 @@
 
 @import 'home';
 @import 'add_data';
-@import 'manage_data';
 @import 'sample_data_set_cards';
 @import 'solutions_section';
 @import 'synopsis';
diff --git a/src/plugins/home/public/application/components/_solutions_section.scss b/src/plugins/home/public/application/components/_solutions_section.scss
index e80f817308b3e..53c5678ff0b09 100644
--- a/src/plugins/home/public/application/components/_solutions_section.scss
+++ b/src/plugins/home/public/application/components/_solutions_section.scss
@@ -50,20 +50,20 @@
     @include euiSlightShadowHover;
     transform: translateY(-2px);
 
-    .euiTitle {
+    .homSolutionPanel__title {
       text-decoration: underline;
     }
   }
+}
 
-  &,
-  .euiPanel {
-    display: flex;
-    flex-direction: column;
-  }
+.homSolutionPanel,
+.homSolutionPanel__inner {
+  display: flex;
+  flex-direction: column;
+}
 
-  .euiPanel {
-    overflow: hidden;
-  }
+.homSolutionPanel__inner {
+  overflow: hidden;
 }
 
 .homSolutionPanel__header {
diff --git a/src/plugins/home/public/application/components/add_data/__snapshots__/add_data.test.tsx.snap b/src/plugins/home/public/application/components/add_data/__snapshots__/add_data.test.tsx.snap
index 2a2a39bbb04e5..e7136ac817249 100644
--- a/src/plugins/home/public/application/components/add_data/__snapshots__/add_data.test.tsx.snap
+++ b/src/plugins/home/public/application/components/add_data/__snapshots__/add_data.test.tsx.snap
@@ -29,17 +29,21 @@ exports[`AddData render 1`] = `
       className="homDataAdd__actions"
       grow={false}
     >
-      <EuiButtonEmpty
-        href="#/tutorial_directory/sampleData"
-        iconType="visTable"
-        size="xs"
-      >
-        <FormattedMessage
-          defaultMessage="Try our sample data"
-          id="home.addData.sampleDataButtonLabel"
-          values={Object {}}
-        />
-      </EuiButtonEmpty>
+      <div>
+        <EuiButtonEmpty
+          className="homDataAdd__actionButton"
+          flush="left"
+          href="#/tutorial_directory/sampleData"
+          iconType="visTable"
+          size="xs"
+        >
+          <FormattedMessage
+            defaultMessage="Try our sample data"
+            id="home.addData.sampleDataButtonLabel"
+            values={Object {}}
+          />
+        </EuiButtonEmpty>
+      </div>
     </EuiFlexItem>
   </EuiFlexGroup>
   <EuiSpacer
diff --git a/src/plugins/home/public/application/components/add_data/add_data.tsx b/src/plugins/home/public/application/components/add_data/add_data.tsx
index 7b6156e5d8510..0311c1fc5e5c6 100644
--- a/src/plugins/home/public/application/components/add_data/add_data.tsx
+++ b/src/plugins/home/public/application/components/add_data/add_data.tsx
@@ -44,12 +44,20 @@ export const AddData: FC<Props> = ({ addBasePath, features }) => (
       </EuiFlexItem>
 
       <EuiFlexItem className="homDataAdd__actions" grow={false}>
-        <EuiButtonEmpty iconType="visTable" href="#/tutorial_directory/sampleData" size="xs">
-          <FormattedMessage
-            id="home.addData.sampleDataButtonLabel"
-            defaultMessage="Try our sample data"
-          />
-        </EuiButtonEmpty>
+        <div>
+          <EuiButtonEmpty
+            className="homDataAdd__actionButton"
+            flush="left"
+            href="#/tutorial_directory/sampleData"
+            iconType="visTable"
+            size="xs"
+          >
+            <FormattedMessage
+              id="home.addData.sampleDataButtonLabel"
+              defaultMessage="Try our sample data"
+            />
+          </EuiButtonEmpty>
+        </div>
       </EuiFlexItem>
     </EuiFlexGroup>
 
diff --git a/src/plugins/home/public/application/components/home.js b/src/plugins/home/public/application/components/home.js
index 9e8b715dee54a..e27db0cc1aff6 100644
--- a/src/plugins/home/public/application/components/home.js
+++ b/src/plugins/home/public/application/components/home.js
@@ -20,9 +20,9 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { FormattedMessage } from '@kbn/i18n/react';
-import { EuiTitle, EuiFlexGroup, EuiFlexItem, EuiHorizontalRule } from '@elastic/eui';
+import { EuiFlexGroup, EuiFlexItem, EuiHorizontalRule } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
-import { OverviewFooter, OverviewHeader } from '../../../../../../src/plugins/kibana_react/public';
+import { PageFooter, PageHeader } from '../../../../../../src/plugins/kibana_react/public';
 import { HOME_APP_BASE_PATH } from '../../../common/constants';
 import { FeatureCatalogueCategory } from '../../services';
 import { getServices } from '../kibana_services';
@@ -128,26 +128,13 @@ export class Home extends Component {
     }
 
     return (
-      <main aria-labelledby="homHeader__title" className="homWrapper" data-test-subj="homeApp">
-        <header
-          className={`homHeader ${
-            solutions.length ? 'homHeader--hasSolutions' : 'homHeader--noSolutions'
-          }`}
-        >
-          <div className="homHeader__inner">
-            <OverviewHeader
-              title={
-                <EuiTitle size="m">
-                  <h1 id="homHeader__title">
-                    <FormattedMessage id="home.header.title" defaultMessage="Home" />
-                  </h1>
-                </EuiTitle>
-              }
-              showDevToolsLink
-              showManagementLink
-            />
-          </div>
-        </header>
+      <main aria-labelledby="pageHeader__title" className="homWrapper" data-test-subj="homeApp">
+        <PageHeader
+          overlap={solutions.length}
+          showDevToolsLink
+          showManagementLink
+          title={<FormattedMessage id="home.header.title" defaultMessage="Home" />}
+        />
 
         <div className="homContent">
           {solutions.length ? (
@@ -176,7 +163,7 @@ export class Home extends Component {
 
           <EuiHorizontalRule margin="xl" aria-hidden="true" />
 
-          <OverviewFooter path={HOME_APP_BASE_PATH} />
+          <PageFooter path={HOME_APP_BASE_PATH} />
         </div>
       </main>
     );
diff --git a/src/plugins/home/public/application/components/solutions_section/__snapshots__/solution_panel.test.tsx.snap b/src/plugins/home/public/application/components/solutions_section/__snapshots__/solution_panel.test.tsx.snap
index ad92aac67d51b..726d3dda4e9cc 100644
--- a/src/plugins/home/public/application/components/solutions_section/__snapshots__/solution_panel.test.tsx.snap
+++ b/src/plugins/home/public/application/components/solutions_section/__snapshots__/solution_panel.test.tsx.snap
@@ -13,6 +13,7 @@ exports[`SolutionPanel renders the solution panel for the given solution 1`] = `
     onClick={[Function]}
   >
     <EuiPanel
+      className="homSolutionPanel__inner"
       paddingSize="none"
     >
       <EuiFlexGroup
diff --git a/src/plugins/home/public/application/components/solutions_section/__snapshots__/solution_title.test.tsx.snap b/src/plugins/home/public/application/components/solutions_section/__snapshots__/solution_title.test.tsx.snap
index 88db2f82984c1..ed03fb12c794f 100644
--- a/src/plugins/home/public/application/components/solutions_section/__snapshots__/solution_title.test.tsx.snap
+++ b/src/plugins/home/public/application/components/solutions_section/__snapshots__/solution_title.test.tsx.snap
@@ -16,7 +16,7 @@ exports[`SolutionTitle renders the title section of the solution panel 1`] = `
       size="l"
     />
     <EuiTitle
-      className="eui-textInheritColor"
+      className="homSolutionPanel__title eui-textInheritColor"
       size="s"
     >
       <h3>
diff --git a/src/plugins/home/public/application/components/solutions_section/solution_panel.tsx b/src/plugins/home/public/application/components/solutions_section/solution_panel.tsx
index 9fcd62fc5dbf7..943260efb275f 100644
--- a/src/plugins/home/public/application/components/solutions_section/solution_panel.tsx
+++ b/src/plugins/home/public/application/components/solutions_section/solution_panel.tsx
@@ -67,7 +67,7 @@ export const SolutionPanel: FC<Props> = ({ addBasePath, solution, apps = [] }) =
       href={addBasePath(solution.path)}
       onClick={createAppNavigationHandler(solution.path)}
     >
-      <EuiPanel paddingSize="none">
+      <EuiPanel className="homSolutionPanel__inner" paddingSize="none">
         <EuiFlexGroup gutterSize="none">
           <EuiFlexItem grow={1} className={`homSolutionPanel__header`}>
             <SolutionTitle
diff --git a/src/plugins/home/public/application/components/solutions_section/solution_title.tsx b/src/plugins/home/public/application/components/solutions_section/solution_title.tsx
index fb833a40807d2..a9874ff7ddbe7 100644
--- a/src/plugins/home/public/application/components/solutions_section/solution_title.tsx
+++ b/src/plugins/home/public/application/components/solutions_section/solution_title.tsx
@@ -45,7 +45,7 @@ export const SolutionTitle: FC<Props> = ({ title, subtitle, iconType }) => (
         className="homSolutionPanel__icon"
       />
 
-      <EuiTitle className="eui-textInheritColor" size="s">
+      <EuiTitle className="homSolutionPanel__title eui-textInheritColor" size="s">
         <h3>{title}</h3>
       </EuiTitle>
 
diff --git a/src/plugins/home/public/application/components/synopsis.js b/src/plugins/home/public/application/components/synopsis.js
index fbe3bb3ed6769..0777c0db7210e 100644
--- a/src/plugins/home/public/application/components/synopsis.js
+++ b/src/plugins/home/public/application/components/synopsis.js
@@ -38,7 +38,7 @@ export function Synopsis({
   if (iconUrl) {
     optionalImg = <img alt="" className="synopsisIcon" src={iconUrl} />;
   } else if (iconType) {
-    optionalImg = <EuiIcon size="l" title="" type={iconType} />;
+    optionalImg = <EuiIcon color="text" size="l" title="" type={iconType} />;
   }
 
   const classes = classNames('homSynopsis__card', {
diff --git a/src/plugins/kibana_overview/public/components/_overview.scss b/src/plugins/kibana_overview/public/components/_overview.scss
index 911a0346e2824..74a58122d4851 100644
--- a/src/plugins/kibana_overview/public/components/_overview.scss
+++ b/src/plugins/kibana_overview/public/components/_overview.scss
@@ -17,9 +17,6 @@
  * under the License.
  */
 
-// Local page variables
-$kbnOverviewPageWidth: 1200px;
-
 .kbnOverviewWrapper {
   background-color: $euiColorEmptyShade;
   display: flex;
@@ -27,46 +24,21 @@ $kbnOverviewPageWidth: 1200px;
   min-height: calc(100vh - #{$euiHeaderHeightCompensation});
 }
 
-.kbnOverviewHeader {
-  background-color: $euiPageBackgroundColor;
-  border-bottom: $euiBorderWidthThin solid $euiColorLightShade;
-}
-
-.kbnOverviewHeader__inner {
-  margin: 0 auto;
-  max-width: $kbnOverviewPageWidth;
-  padding: $euiSizeXL $euiSize;
-}
-
-// Accounting for no `flush="both"` prop on EuiButtonEmpty
-.kbnOverviewHeader__actionItem .euiButtonEmpty__content {
-  padding-left: 0;
-  padding-right: 0;
-}
-
 .kbnOverviewContent {
   margin: 0 auto;
-  max-width: $kbnOverviewPageWidth;
+  max-width: 1200px;
   padding: $euiSizeXL $euiSize;
   width: 100%;
 
   // Ensure card heights are stretched equally when wrapped with this element
   .kbnRedirectCrossAppLinks {
+    align-items: flex-start;
     display: flex;
     flex: 1;
     flex-direction: column;
   }
 }
 
-// Prevent children from rendering as flex items
-.kbnOverviewGettingStarted__content {
-  display: block;
-}
-
-.kbnOverviewGettingStarted__apps .euiIcon__fillSecondary {
-  fill: $euiColorDarkestShade;
-}
-
 .kbnOverviewApps__item {
   .kbnOverviewApps__group--primary & {
     @include euiBreakpoint('m', 'l', 'xl') {
@@ -136,22 +108,9 @@ $kbnOverviewPageWidth: 1200px;
   }
 }
 
-.kbnOverviewDataAdd__actions {
-  // Prevent children from rendering as flex items
-  display: block;
-
-  // Accounting for no `flush="both"` prop on EuiButtonEmpty
-  .euiButtonEmpty__content {
-    padding-left: 0;
-    padding-right: 0;
-  }
-}
-
-.kbnOverviewDataAdd__content,
-.kbnOverviewDataManage__content {
-  & .euiIcon__fillSecondary {
-    fill: $euiColorDarkestShade;
-  }
+// Accounting for no `flush="both"` prop on EuiButtonEmpty
+.kbnOverviewDataAdd__actionButton {
+  margin-right: 0;
 }
 
 .kbnOverviewDataManage__item:not(:only-child) {
diff --git a/src/plugins/kibana_overview/public/components/add_data/__snapshots__/add_data.test.tsx.snap b/src/plugins/kibana_overview/public/components/add_data/__snapshots__/add_data.test.tsx.snap
index 66caceb117194..42623abd79ac0 100644
--- a/src/plugins/kibana_overview/public/components/add_data/__snapshots__/add_data.test.tsx.snap
+++ b/src/plugins/kibana_overview/public/components/add_data/__snapshots__/add_data.test.tsx.snap
@@ -29,17 +29,21 @@ exports[`AddData render 1`] = `
       className="kbnOverviewDataAdd__actions"
       grow={false}
     >
-      <EuiButtonEmpty
-        href="#/tutorial_directory/sampleData"
-        iconType="visTable"
-        size="xs"
-      >
-        <FormattedMessage
-          defaultMessage="Try our sample data"
-          id="kibanaOverview.addData.sampleDataButtonLabel"
-          values={Object {}}
-        />
-      </EuiButtonEmpty>
+      <div>
+        <EuiButtonEmpty
+          className="kbnOverviewDataAdd__actionButton"
+          flush="left"
+          href="#/tutorial_directory/sampleData"
+          iconType="visTable"
+          size="xs"
+        >
+          <FormattedMessage
+            defaultMessage="Try our sample data"
+            id="kibanaOverview.addData.sampleDataButtonLabel"
+            values={Object {}}
+          />
+        </EuiButtonEmpty>
+      </div>
     </EuiFlexItem>
   </EuiFlexGroup>
   <EuiSpacer
diff --git a/src/plugins/kibana_overview/public/components/add_data/add_data.tsx b/src/plugins/kibana_overview/public/components/add_data/add_data.tsx
index 2d1e6a466327b..69026d72f5ed6 100644
--- a/src/plugins/kibana_overview/public/components/add_data/add_data.tsx
+++ b/src/plugins/kibana_overview/public/components/add_data/add_data.tsx
@@ -51,12 +51,20 @@ export const AddData: FC<Props> = ({ features }) => {
         </EuiFlexItem>
 
         <EuiFlexItem className="kbnOverviewDataAdd__actions" grow={false}>
-          <EuiButtonEmpty iconType="visTable" href="#/tutorial_directory/sampleData" size="xs">
-            <FormattedMessage
-              id="kibanaOverview.addData.sampleDataButtonLabel"
-              defaultMessage="Try our sample data"
-            />
-          </EuiButtonEmpty>
+          <div>
+            <EuiButtonEmpty
+              className="kbnOverviewDataAdd__actionButton"
+              flush="left"
+              href="#/tutorial_directory/sampleData"
+              iconType="visTable"
+              size="xs"
+            >
+              <FormattedMessage
+                id="kibanaOverview.addData.sampleDataButtonLabel"
+                defaultMessage="Try our sample data"
+              />
+            </EuiButtonEmpty>
+          </div>
         </EuiFlexItem>
       </EuiFlexGroup>
 
diff --git a/src/plugins/kibana_overview/public/components/getting_started/__snapshots__/getting_started.test.tsx.snap b/src/plugins/kibana_overview/public/components/getting_started/__snapshots__/getting_started.test.tsx.snap
index c87583593710b..e11cf37dfc45a 100644
--- a/src/plugins/kibana_overview/public/components/getting_started/__snapshots__/getting_started.test.tsx.snap
+++ b/src/plugins/kibana_overview/public/components/getting_started/__snapshots__/getting_started.test.tsx.snap
@@ -11,169 +11,177 @@ exports[`GettingStarted dark mode on 1`] = `
     <EuiFlexItem
       className="kbnOverviewGettingStarted__content"
     >
-      <EuiTitle
-        size="s"
-      >
-        <h2
-          id="kbnOverviewGettingStarted__title"
+      <div>
+        <EuiTitle
+          size="s"
         >
-          <FormattedMessage
-            defaultMessage="Getting started with Kibana"
-            id="kibanaOverview.gettingStarted.title"
-            values={Object {}}
-          />
-        </h2>
-      </EuiTitle>
-      <EuiSpacer
-        size="m"
-      />
-      <EuiText>
-        <p>
-          <FormattedMessage
-            defaultMessage="Kibana empowers you to visualize your data, your way.  Start with one question, and see where the answer leads you."
-            id="kibanaOverview.gettingStarted.description"
-            values={Object {}}
-          />
-        </p>
-      </EuiText>
-      <EuiSpacer
-        size="xl"
-      />
-      <EuiFlexGrid
-        className="kbnOverviewGettingStarted__apps"
-        columns={2}
-      >
-        <EuiFlexItem
-          key="Dashboard"
-        >
-          <EuiCard
-            description="Analyze data in dashboards."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="dashboardApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Dashboard"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-        <EuiFlexItem
-          key="Discover"
-        >
-          <EuiCard
-            description="Search and find insights."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="discoverApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Discover"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-        <EuiFlexItem
-          key="Canvas"
-        >
-          <EuiCard
-            description="Design pixel-perfect reports."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="canvasApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Canvas"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-        <EuiFlexItem
-          key="Maps"
-        >
-          <EuiCard
-            description="Plot geographic data."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="gisApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Maps"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-        <EuiFlexItem
-          key="Machine Learning"
-        >
-          <EuiCard
-            description="Model, predict, and detect."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="machineLearningApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Machine Learning"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-        <EuiFlexItem
-          key="Graph"
-        >
-          <EuiCard
-            description="Reveal patterns and relationships."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="graphApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Graph"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-      </EuiFlexGrid>
-      <EuiSpacer
-        size="xl"
-      />
-      <RedirectAppLinks>
-        <EuiButton
-          fill={true}
-          href="/app/management/kibana/indexPatterns"
-          iconType="indexOpen"
+          <h2
+            id="kbnOverviewGettingStarted__title"
+          >
+            <FormattedMessage
+              defaultMessage="Getting started with Kibana"
+              id="kibanaOverview.gettingStarted.title"
+              values={Object {}}
+            />
+          </h2>
+        </EuiTitle>
+        <EuiSpacer
+          size="m"
+        />
+        <EuiText>
+          <p>
+            <FormattedMessage
+              defaultMessage="Kibana empowers you to visualize your data, your way.  Start with one question, and see where the answer leads you."
+              id="kibanaOverview.gettingStarted.description"
+              values={Object {}}
+            />
+          </p>
+        </EuiText>
+        <EuiSpacer
+          size="xl"
+        />
+        <EuiFlexGrid
+          className="kbnOverviewGettingStarted__apps"
+          columns={2}
         >
-          <FormattedMessage
-            defaultMessage="Add your data"
-            id="kibanaOverview.gettingStarted.addDataButtonLabel"
-            values={Object {}}
-          />
-        </EuiButton>
-      </RedirectAppLinks>
+          <EuiFlexItem
+            key="Dashboard"
+          >
+            <EuiCard
+              description="Analyze data in dashboards."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="dashboardApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Dashboard"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem
+            key="Discover"
+          >
+            <EuiCard
+              description="Search and find insights."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="discoverApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Discover"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem
+            key="Canvas"
+          >
+            <EuiCard
+              description="Design pixel-perfect reports."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="canvasApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Canvas"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem
+            key="Maps"
+          >
+            <EuiCard
+              description="Plot geographic data."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="gisApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Maps"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem
+            key="Machine Learning"
+          >
+            <EuiCard
+              description="Model, predict, and detect."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="machineLearningApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Machine Learning"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem
+            key="Graph"
+          >
+            <EuiCard
+              description="Reveal patterns and relationships."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="graphApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Graph"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+        </EuiFlexGrid>
+        <EuiSpacer
+          size="xl"
+        />
+        <RedirectAppLinks>
+          <EuiButton
+            fill={true}
+            href="/app/management/kibana/indexPatterns"
+            iconType="indexOpen"
+          >
+            <FormattedMessage
+              defaultMessage="Add your data"
+              id="kibanaOverview.gettingStarted.addDataButtonLabel"
+              values={Object {}}
+            />
+          </EuiButton>
+        </RedirectAppLinks>
+      </div>
     </EuiFlexItem>
     <EuiFlexItem
       className="kbnOverviewGettingStarted__graphic"
@@ -198,169 +206,177 @@ exports[`GettingStarted render 1`] = `
     <EuiFlexItem
       className="kbnOverviewGettingStarted__content"
     >
-      <EuiTitle
-        size="s"
-      >
-        <h2
-          id="kbnOverviewGettingStarted__title"
+      <div>
+        <EuiTitle
+          size="s"
         >
-          <FormattedMessage
-            defaultMessage="Getting started with Kibana"
-            id="kibanaOverview.gettingStarted.title"
-            values={Object {}}
-          />
-        </h2>
-      </EuiTitle>
-      <EuiSpacer
-        size="m"
-      />
-      <EuiText>
-        <p>
-          <FormattedMessage
-            defaultMessage="Kibana empowers you to visualize your data, your way.  Start with one question, and see where the answer leads you."
-            id="kibanaOverview.gettingStarted.description"
-            values={Object {}}
-          />
-        </p>
-      </EuiText>
-      <EuiSpacer
-        size="xl"
-      />
-      <EuiFlexGrid
-        className="kbnOverviewGettingStarted__apps"
-        columns={2}
-      >
-        <EuiFlexItem
-          key="Dashboard"
-        >
-          <EuiCard
-            description="Analyze data in dashboards."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="dashboardApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Dashboard"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-        <EuiFlexItem
-          key="Discover"
-        >
-          <EuiCard
-            description="Search and find insights."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="discoverApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Discover"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-        <EuiFlexItem
-          key="Canvas"
-        >
-          <EuiCard
-            description="Design pixel-perfect reports."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="canvasApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Canvas"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-        <EuiFlexItem
-          key="Maps"
-        >
-          <EuiCard
-            description="Plot geographic data."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="gisApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Maps"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-        <EuiFlexItem
-          key="Machine Learning"
-        >
-          <EuiCard
-            description="Model, predict, and detect."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="machineLearningApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Machine Learning"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-        <EuiFlexItem
-          key="Graph"
-        >
-          <EuiCard
-            description="Reveal patterns and relationships."
-            display="plain"
-            icon={
-              <EuiIcon
-                size="l"
-                type="graphApp"
-              />
-            }
-            layout="horizontal"
-            paddingSize="none"
-            title="Graph"
-            titleElement="h3"
-            titleSize="xs"
-          />
-        </EuiFlexItem>
-      </EuiFlexGrid>
-      <EuiSpacer
-        size="xl"
-      />
-      <RedirectAppLinks>
-        <EuiButton
-          fill={true}
-          href="/app/management/kibana/indexPatterns"
-          iconType="indexOpen"
+          <h2
+            id="kbnOverviewGettingStarted__title"
+          >
+            <FormattedMessage
+              defaultMessage="Getting started with Kibana"
+              id="kibanaOverview.gettingStarted.title"
+              values={Object {}}
+            />
+          </h2>
+        </EuiTitle>
+        <EuiSpacer
+          size="m"
+        />
+        <EuiText>
+          <p>
+            <FormattedMessage
+              defaultMessage="Kibana empowers you to visualize your data, your way.  Start with one question, and see where the answer leads you."
+              id="kibanaOverview.gettingStarted.description"
+              values={Object {}}
+            />
+          </p>
+        </EuiText>
+        <EuiSpacer
+          size="xl"
+        />
+        <EuiFlexGrid
+          className="kbnOverviewGettingStarted__apps"
+          columns={2}
         >
-          <FormattedMessage
-            defaultMessage="Add your data"
-            id="kibanaOverview.gettingStarted.addDataButtonLabel"
-            values={Object {}}
-          />
-        </EuiButton>
-      </RedirectAppLinks>
+          <EuiFlexItem
+            key="Dashboard"
+          >
+            <EuiCard
+              description="Analyze data in dashboards."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="dashboardApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Dashboard"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem
+            key="Discover"
+          >
+            <EuiCard
+              description="Search and find insights."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="discoverApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Discover"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem
+            key="Canvas"
+          >
+            <EuiCard
+              description="Design pixel-perfect reports."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="canvasApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Canvas"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem
+            key="Maps"
+          >
+            <EuiCard
+              description="Plot geographic data."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="gisApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Maps"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem
+            key="Machine Learning"
+          >
+            <EuiCard
+              description="Model, predict, and detect."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="machineLearningApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Machine Learning"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem
+            key="Graph"
+          >
+            <EuiCard
+              description="Reveal patterns and relationships."
+              display="plain"
+              icon={
+                <EuiIcon
+                  color="text"
+                  size="l"
+                  type="graphApp"
+                />
+              }
+              layout="horizontal"
+              paddingSize="none"
+              title="Graph"
+              titleElement="h3"
+              titleSize="xs"
+            />
+          </EuiFlexItem>
+        </EuiFlexGrid>
+        <EuiSpacer
+          size="xl"
+        />
+        <RedirectAppLinks>
+          <EuiButton
+            fill={true}
+            href="/app/management/kibana/indexPatterns"
+            iconType="indexOpen"
+          >
+            <FormattedMessage
+              defaultMessage="Add your data"
+              id="kibanaOverview.gettingStarted.addDataButtonLabel"
+              values={Object {}}
+            />
+          </EuiButton>
+        </RedirectAppLinks>
+      </div>
     </EuiFlexItem>
     <EuiFlexItem
       className="kbnOverviewGettingStarted__graphic"
diff --git a/src/plugins/kibana_overview/public/components/getting_started/getting_started.tsx b/src/plugins/kibana_overview/public/components/getting_started/getting_started.tsx
index ddf46d5c5529b..aa46dc6e40ca2 100644
--- a/src/plugins/kibana_overview/public/components/getting_started/getting_started.tsx
+++ b/src/plugins/kibana_overview/public/components/getting_started/getting_started.tsx
@@ -57,55 +57,57 @@ export const GettingStarted: FC<Props> = ({ addBasePath, isDarkTheme, apps }) =>
     >
       <EuiFlexGroup alignItems="center">
         <EuiFlexItem className="kbnOverviewGettingStarted__content">
-          <EuiTitle size="s">
-            <h2 id="kbnOverviewGettingStarted__title">
-              <FormattedMessage
-                id="kibanaOverview.gettingStarted.title"
-                defaultMessage="Getting started with Kibana"
-              />
-            </h2>
-          </EuiTitle>
+          <div>
+            <EuiTitle size="s">
+              <h2 id="kbnOverviewGettingStarted__title">
+                <FormattedMessage
+                  id="kibanaOverview.gettingStarted.title"
+                  defaultMessage="Getting started with Kibana"
+                />
+              </h2>
+            </EuiTitle>
 
-          <EuiSpacer size="m" />
+            <EuiSpacer size="m" />
 
-          <EuiText>
-            <p>
-              <FormattedMessage
-                id="kibanaOverview.gettingStarted.description"
-                defaultMessage="Kibana empowers you to visualize your data, your way.  Start with one question, and see where the answer leads you."
-              />
-            </p>
-          </EuiText>
+            <EuiText>
+              <p>
+                <FormattedMessage
+                  id="kibanaOverview.gettingStarted.description"
+                  defaultMessage="Kibana empowers you to visualize your data, your way.  Start with one question, and see where the answer leads you."
+                />
+              </p>
+            </EuiText>
 
-          <EuiSpacer size="xl" />
+            <EuiSpacer size="xl" />
 
-          <EuiFlexGrid className="kbnOverviewGettingStarted__apps" columns={2}>
-            {apps.map(({ subtitle = '', icon, title }) => (
-              <EuiFlexItem key={title}>
-                <EuiCard
-                  description={subtitle}
-                  display="plain"
-                  icon={<EuiIcon size="l" type={icon} />}
-                  layout="horizontal"
-                  paddingSize="none"
-                  title={title}
-                  titleElement="h3"
-                  titleSize="xs"
-                />
-              </EuiFlexItem>
-            ))}
-          </EuiFlexGrid>
+            <EuiFlexGrid className="kbnOverviewGettingStarted__apps" columns={2}>
+              {apps.map(({ subtitle = '', icon, title }) => (
+                <EuiFlexItem key={title}>
+                  <EuiCard
+                    description={subtitle}
+                    display="plain"
+                    icon={<EuiIcon color="text" size="l" type={icon} />}
+                    layout="horizontal"
+                    paddingSize="none"
+                    title={title}
+                    titleElement="h3"
+                    titleSize="xs"
+                  />
+                </EuiFlexItem>
+              ))}
+            </EuiFlexGrid>
 
-          <EuiSpacer size="xl" />
+            <EuiSpacer size="xl" />
 
-          <RedirectAppLinks application={application}>
-            <EuiButton fill iconType="indexOpen" href={'/app/management/kibana/indexPatterns'}>
-              <FormattedMessage
-                defaultMessage="Add your data"
-                id="kibanaOverview.gettingStarted.addDataButtonLabel"
-              />
-            </EuiButton>
-          </RedirectAppLinks>
+            <RedirectAppLinks application={application}>
+              <EuiButton fill iconType="indexOpen" href={'/app/management/kibana/indexPatterns'}>
+                <FormattedMessage
+                  defaultMessage="Add your data"
+                  id="kibanaOverview.gettingStarted.addDataButtonLabel"
+                />
+              </EuiButton>
+            </RedirectAppLinks>
+          </div>
         </EuiFlexItem>
 
         <EuiFlexItem className="kbnOverviewGettingStarted__graphic">
diff --git a/src/plugins/kibana_overview/public/components/overview/__snapshots__/overview.test.tsx.snap b/src/plugins/kibana_overview/public/components/overview/__snapshots__/overview.test.tsx.snap
index 393309a479ec3..004dbdaaf43ee 100644
--- a/src/plugins/kibana_overview/public/components/overview/__snapshots__/overview.test.tsx.snap
+++ b/src/plugins/kibana_overview/public/components/overview/__snapshots__/overview.test.tsx.snap
@@ -2,49 +2,20 @@
 
 exports[`Overview render 1`] = `
 <main
-  aria-labelledby="kbnOverviewHeader__title"
+  aria-labelledby="pageHeader__title"
   className="kbnOverviewWrapper"
 >
-  <header
-    className="kbnOverviewHeader"
-  >
-    <div
-      className="kbnOverviewHeader__inner"
-    >
-      <mockConstructor
-        title={
-          <EuiFlexGroup
-            gutterSize="m"
-            responsive={false}
-          >
-            <EuiFlexItem
-              grow={false}
-            >
-              <EuiIcon
-                size="xxl"
-                type="logoKibana"
-              />
-            </EuiFlexItem>
-            <EuiFlexItem>
-              <EuiTitle
-                size="m"
-              >
-                <h1
-                  id="kbnOverviewHeader__title"
-                >
-                  <FormattedMessage
-                    defaultMessage="Kibana"
-                    id="kibanaOverview.header.title"
-                    values={Object {}}
-                  />
-                </h1>
-              </EuiTitle>
-            </EuiFlexItem>
-          </EuiFlexGroup>
-        }
+  <mockConstructor
+    hideToolbar={false}
+    iconType="logoKibana"
+    title={
+      <FormattedMessage
+        defaultMessage="Kibana"
+        id="kibanaOverview.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="kbnOverviewContent"
   >
@@ -267,49 +238,20 @@ exports[`Overview render 1`] = `
 
 exports[`Overview without features 1`] = `
 <main
-  aria-labelledby="kbnOverviewHeader__title"
+  aria-labelledby="pageHeader__title"
   className="kbnOverviewWrapper"
 >
-  <header
-    className="kbnOverviewHeader"
-  >
-    <div
-      className="kbnOverviewHeader__inner"
-    >
-      <mockConstructor
-        title={
-          <EuiFlexGroup
-            gutterSize="m"
-            responsive={false}
-          >
-            <EuiFlexItem
-              grow={false}
-            >
-              <EuiIcon
-                size="xxl"
-                type="logoKibana"
-              />
-            </EuiFlexItem>
-            <EuiFlexItem>
-              <EuiTitle
-                size="m"
-              >
-                <h1
-                  id="kbnOverviewHeader__title"
-                >
-                  <FormattedMessage
-                    defaultMessage="Kibana"
-                    id="kibanaOverview.header.title"
-                    values={Object {}}
-                  />
-                </h1>
-              </EuiTitle>
-            </EuiFlexItem>
-          </EuiFlexGroup>
-        }
+  <mockConstructor
+    hideToolbar={false}
+    iconType="logoKibana"
+    title={
+      <FormattedMessage
+        defaultMessage="Kibana"
+        id="kibanaOverview.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="kbnOverviewContent"
   >
@@ -532,49 +474,20 @@ exports[`Overview without features 1`] = `
 
 exports[`Overview without solutions 1`] = `
 <main
-  aria-labelledby="kbnOverviewHeader__title"
+  aria-labelledby="pageHeader__title"
   className="kbnOverviewWrapper"
 >
-  <header
-    className="kbnOverviewHeader"
-  >
-    <div
-      className="kbnOverviewHeader__inner"
-    >
-      <mockConstructor
-        title={
-          <EuiFlexGroup
-            gutterSize="m"
-            responsive={false}
-          >
-            <EuiFlexItem
-              grow={false}
-            >
-              <EuiIcon
-                size="xxl"
-                type="logoKibana"
-              />
-            </EuiFlexItem>
-            <EuiFlexItem>
-              <EuiTitle
-                size="m"
-              >
-                <h1
-                  id="kbnOverviewHeader__title"
-                >
-                  <FormattedMessage
-                    defaultMessage="Kibana"
-                    id="kibanaOverview.header.title"
-                    values={Object {}}
-                  />
-                </h1>
-              </EuiTitle>
-            </EuiFlexItem>
-          </EuiFlexGroup>
-        }
+  <mockConstructor
+    hideToolbar={false}
+    iconType="logoKibana"
+    title={
+      <FormattedMessage
+        defaultMessage="Kibana"
+        id="kibanaOverview.header.title"
+        values={Object {}}
       />
-    </div>
-  </header>
+    }
+  />
   <div
     className="kbnOverviewContent"
   >
diff --git a/src/plugins/kibana_overview/public/components/overview/overview.test.tsx b/src/plugins/kibana_overview/public/components/overview/overview.test.tsx
index 51e8c16d8313b..500fcf9f6e808 100644
--- a/src/plugins/kibana_overview/public/components/overview/overview.test.tsx
+++ b/src/plugins/kibana_overview/public/components/overview/overview.test.tsx
@@ -32,8 +32,8 @@ jest.mock('../../../../../../src/plugins/kibana_react/public', () => ({
     },
   }),
   RedirectAppLinks: jest.fn((element: JSX.Element) => element),
-  OverviewFooter: jest.fn().mockReturnValue(<></>),
-  OverviewHeader: jest.fn().mockReturnValue(<></>),
+  PageFooter: jest.fn().mockReturnValue(<></>),
+  PageHeader: jest.fn().mockReturnValue(<></>),
 }));
 
 afterAll(() => jest.clearAllMocks());
diff --git a/src/plugins/kibana_overview/public/components/overview/overview.tsx b/src/plugins/kibana_overview/public/components/overview/overview.tsx
index 60c9f7d172a71..1ebdb331f62a1 100644
--- a/src/plugins/kibana_overview/public/components/overview/overview.tsx
+++ b/src/plugins/kibana_overview/public/components/overview/overview.tsx
@@ -24,7 +24,6 @@ import {
   EuiFlexGroup,
   EuiFlexItem,
   EuiHorizontalRule,
-  EuiIcon,
   EuiScreenReaderOnly,
   EuiSpacer,
   EuiTitle,
@@ -35,8 +34,8 @@ import { CoreStart } from 'kibana/public';
 import {
   RedirectAppLinks,
   useKibana,
-  OverviewFooter,
-  OverviewHeader,
+  PageFooter,
+  PageHeader,
 } from '../../../../../../src/plugins/kibana_react/public';
 import { FetchResult } from '../../../../../../src/plugins/newsfeed/public';
 import {
@@ -127,29 +126,13 @@ export const Overview: FC<Props> = ({ newsFetchResult, solutions, features }) =>
   const mainApps = ['dashboard', 'discover'];
   const remainingApps = kibanaApps.map(({ id }) => id).filter((id) => !mainApps.includes(id));
 
-  const pageTitle = (
-    <EuiFlexGroup gutterSize="m" responsive={false}>
-      <EuiFlexItem grow={false}>
-        <EuiIcon size="xxl" type="logoKibana" />
-      </EuiFlexItem>
-
-      <EuiFlexItem>
-        <EuiTitle size="m">
-          <h1 id="kbnOverviewHeader__title">
-            <FormattedMessage defaultMessage="Kibana" id="kibanaOverview.header.title" />
-          </h1>
-        </EuiTitle>
-      </EuiFlexItem>
-    </EuiFlexGroup>
-  );
-
   return (
-    <main aria-labelledby="kbnOverviewHeader__title" className="kbnOverviewWrapper">
-      <header className="kbnOverviewHeader">
-        <div className="kbnOverviewHeader__inner">
-          {isNewKibanaInstance ? pageTitle : <OverviewHeader title={pageTitle} />}
-        </div>
-      </header>
+    <main aria-labelledby="pageHeader__title" className="kbnOverviewWrapper">
+      <PageHeader
+        hideToolbar={isNewKibanaInstance}
+        iconType="logoKibana"
+        title={<FormattedMessage defaultMessage="Kibana" id="kibanaOverview.header.title" />}
+      />
 
       <div className="kbnOverviewContent">
         {isNewKibanaInstance ? (
@@ -270,7 +253,7 @@ export const Overview: FC<Props> = ({ newsFetchResult, solutions, features }) =>
 
         <EuiHorizontalRule margin="xl" aria-hidden="true" />
 
-        <OverviewFooter path={PLUGIN_PATH} />
+        <PageFooter path={PLUGIN_PATH} />
       </div>
     </main>
   );
diff --git a/src/plugins/kibana_overview/public/components/synopsis/__snapshots__/synopsis.test.js.snap b/src/plugins/kibana_overview/public/components/synopsis/__snapshots__/synopsis.test.js.snap
index 190985f70659d..ec192ce1eb32f 100644
--- a/src/plugins/kibana_overview/public/components/synopsis/__snapshots__/synopsis.test.js.snap
+++ b/src/plugins/kibana_overview/public/components/synopsis/__snapshots__/synopsis.test.js.snap
@@ -9,6 +9,7 @@ exports[`props iconType 1`] = `
   href="link_to_item"
   icon={
     <EuiIcon
+      color="text"
       size="l"
       title=""
       type="logoApache"
diff --git a/src/plugins/kibana_overview/public/components/synopsis/synopsis.js b/src/plugins/kibana_overview/public/components/synopsis/synopsis.js
index fbe3bb3ed6769..0777c0db7210e 100644
--- a/src/plugins/kibana_overview/public/components/synopsis/synopsis.js
+++ b/src/plugins/kibana_overview/public/components/synopsis/synopsis.js
@@ -38,7 +38,7 @@ export function Synopsis({
   if (iconUrl) {
     optionalImg = <img alt="" className="synopsisIcon" src={iconUrl} />;
   } else if (iconType) {
-    optionalImg = <EuiIcon size="l" title="" type={iconType} />;
+    optionalImg = <EuiIcon color="text" size="l" title="" type={iconType} />;
   }
 
   const classes = classNames('homSynopsis__card', {
diff --git a/src/plugins/kibana_react/public/index.ts b/src/plugins/kibana_react/public/index.ts
index 2b555e2334691..952cf5c77c97f 100644
--- a/src/plugins/kibana_react/public/index.ts
+++ b/src/plugins/kibana_react/public/index.ts
@@ -20,7 +20,7 @@
 export * from './code_editor';
 export * from './exit_full_screen_button';
 export * from './context';
-export * from './overview_page';
+export * from './page';
 export * from './overlays';
 export * from './ui_settings';
 export * from './field_icon';
diff --git a/src/plugins/kibana_react/public/overview_page/overview_footer/__snapshots__/overview_footer.test.tsx.snap b/src/plugins/kibana_react/public/overview_page/overview_footer/__snapshots__/overview_footer.test.tsx.snap
deleted file mode 100644
index 819720782cce1..0000000000000
--- a/src/plugins/kibana_react/public/overview_page/overview_footer/__snapshots__/overview_footer.test.tsx.snap
+++ /dev/null
@@ -1,44 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`OverviewFooter render 1`] = `
-<footer
-  className="kbnOverviewFooter"
->
-  <EuiFlexGroup
-    alignItems="center"
-    justifyContent="spaceBetween"
-  >
-    <EuiFlexItem
-      grow={false}
-    />
-    <EuiFlexItem
-      grow={false}
-    >
-      <mockConstructor
-        application={
-          Object {
-            "capabilities": Object {
-              "advancedSettings": Object {
-                "show": true,
-              },
-            },
-          }
-        }
-      >
-        <EuiButtonEmpty
-          data-test-subj="allPlugins"
-          href="/app/home#/feature_directory"
-          iconType="apps"
-          size="xs"
-        >
-          <FormattedMessage
-            defaultMessage="View app directory"
-            id="kibana-react.overviewFooter.appDirectoryButtonLabel"
-            values={Object {}}
-          />
-        </EuiButtonEmpty>
-      </mockConstructor>
-    </EuiFlexItem>
-  </EuiFlexGroup>
-</footer>
-`;
diff --git a/src/plugins/kibana_react/public/overview_page/overview_footer/_overview_footer.scss b/src/plugins/kibana_react/public/overview_page/overview_footer/_overview_footer.scss
deleted file mode 100644
index cfe2c6b441431..0000000000000
--- a/src/plugins/kibana_react/public/overview_page/overview_footer/_overview_footer.scss
+++ /dev/null
@@ -1,12 +0,0 @@
-.kbnOverviewFooter {
-  // Prevent children from rendering as flex items
-  .euiFlexItem {
-    display: block;
-  }
-
-  // Accounting for no `flush="both"` prop on EuiButtonEmpty
-  .euiButtonEmpty__content {
-    padding-left: 0;
-    padding-right: 0;
-  }
-}
diff --git a/src/plugins/kibana_react/public/overview_page/overview_footer/index.scss b/src/plugins/kibana_react/public/overview_page/overview_footer/index.scss
deleted file mode 100644
index 56909bf164757..0000000000000
--- a/src/plugins/kibana_react/public/overview_page/overview_footer/index.scss
+++ /dev/null
@@ -1 +0,0 @@
-@import './overview_footer';
diff --git a/src/plugins/kibana_react/public/overview_page/overview_header/__snapshots__/overview_header.test.tsx.snap b/src/plugins/kibana_react/public/overview_page/overview_header/__snapshots__/overview_header.test.tsx.snap
deleted file mode 100644
index 89308b2fff2a5..0000000000000
--- a/src/plugins/kibana_react/public/overview_page/overview_header/__snapshots__/overview_header.test.tsx.snap
+++ /dev/null
@@ -1,45 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`OverviewHeader render 1`] = `
-<EuiFlexGroup>
-  <EuiFlexItem>
-    <h1>
-      Page Title
-    </h1>
-  </EuiFlexItem>
-  <EuiFlexItem
-    grow={false}
-  >
-    <EuiFlexGroup
-      className="kbnOverviewHeader__actions"
-      responsive={false}
-      wrap={true}
-    >
-      <EuiFlexItem
-        className="kbnOverviewHeader__actionItem"
-        grow={false}
-      >
-        <mockConstructor
-          application={
-            Object {
-              "capabilities": Object {
-                "navLinks": Object {
-                  "dev_tools": true,
-                  "management": true,
-                },
-              },
-            }
-          }
-        >
-          <EuiButtonEmpty
-            href="/app/home#/tutorial_directory"
-            iconType="indexOpen"
-          >
-            Add data
-          </EuiButtonEmpty>
-        </mockConstructor>
-      </EuiFlexItem>
-    </EuiFlexGroup>
-  </EuiFlexItem>
-</EuiFlexGroup>
-`;
diff --git a/src/plugins/kibana_react/public/overview_page/overview_header/overview_header.tsx b/src/plugins/kibana_react/public/overview_page/overview_header/overview_header.tsx
deleted file mode 100644
index 3388586149ce5..0000000000000
--- a/src/plugins/kibana_react/public/overview_page/overview_header/overview_header.tsx
+++ /dev/null
@@ -1,84 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import React, { FC } from 'react';
-import { EuiButtonEmpty, EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
-import { i18n } from '@kbn/i18n';
-import { CoreStart } from 'kibana/public';
-import { RedirectAppLinks, useKibana } from '../../../../../../src/plugins/kibana_react/public';
-
-interface Props {
-  title: JSX.Element;
-  showDevToolsLink?: boolean;
-  showManagementLink?: boolean;
-}
-
-export const OverviewHeader: FC<Props> = ({ title, showManagementLink, showDevToolsLink }) => {
-  const {
-    services: { application },
-  } = useKibana<CoreStart>();
-
-  const {
-    management: isManagementEnabled,
-    dev_tools: isDevToolsEnabled,
-  } = application.capabilities.navLinks;
-
-  return (
-    <EuiFlexGroup>
-      <EuiFlexItem>{title}</EuiFlexItem>
-      <EuiFlexItem grow={false}>
-        <EuiFlexGroup className="kbnOverviewHeader__actions" responsive={false} wrap>
-          <EuiFlexItem className="kbnOverviewHeader__actionItem" grow={false}>
-            <RedirectAppLinks application={application}>
-              <EuiButtonEmpty href={'/app/home#/tutorial_directory'} iconType="indexOpen">
-                {i18n.translate('kibana-react.overviewHeader.addDataButtonLabel', {
-                  defaultMessage: 'Add data',
-                })}
-              </EuiButtonEmpty>
-            </RedirectAppLinks>
-          </EuiFlexItem>
-
-          {showManagementLink && isManagementEnabled ? (
-            <EuiFlexItem className="kbnOverviewHeader__actionItem" grow={false}>
-              <RedirectAppLinks application={application}>
-                <EuiButtonEmpty iconType="gear" href={'/app/management'}>
-                  {i18n.translate('kibana-react.overviewHeader.stackManagementButtonLabel', {
-                    defaultMessage: 'Manage',
-                  })}
-                </EuiButtonEmpty>
-              </RedirectAppLinks>
-            </EuiFlexItem>
-          ) : null}
-
-          {showDevToolsLink && isDevToolsEnabled ? (
-            <EuiFlexItem className="kbnOverviewHeader__actionItem" grow={false}>
-              <RedirectAppLinks application={application}>
-                <EuiButtonEmpty iconType="wrench" href={'/app/dev_tools#/console'}>
-                  {i18n.translate('kibana-react.overviewHeader.devToolsButtonLabel', {
-                    defaultMessage: 'Dev tools',
-                  })}
-                </EuiButtonEmpty>
-              </RedirectAppLinks>
-            </EuiFlexItem>
-          ) : null}
-        </EuiFlexGroup>
-      </EuiFlexItem>
-    </EuiFlexGroup>
-  );
-};
diff --git a/src/plugins/kibana_react/public/overview_page/index.ts b/src/plugins/kibana_react/public/page/index.ts
similarity index 91%
rename from src/plugins/kibana_react/public/overview_page/index.ts
rename to src/plugins/kibana_react/public/page/index.ts
index 7dc53b8640a41..33e9b66cb3790 100644
--- a/src/plugins/kibana_react/public/overview_page/index.ts
+++ b/src/plugins/kibana_react/public/page/index.ts
@@ -17,5 +17,5 @@
  * under the License.
  */
 
-export * from './overview_footer';
-export * from './overview_header';
+export * from './page_footer';
+export * from './page_header';
diff --git a/src/plugins/kibana_react/public/page/page_footer/__snapshots__/page_footer.test.tsx.snap b/src/plugins/kibana_react/public/page/page_footer/__snapshots__/page_footer.test.tsx.snap
new file mode 100644
index 0000000000000..7eb79914ae80b
--- /dev/null
+++ b/src/plugins/kibana_react/public/page/page_footer/__snapshots__/page_footer.test.tsx.snap
@@ -0,0 +1,49 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`PageFooter render 1`] = `
+<footer
+  className="pageFooter"
+>
+  <EuiFlexGroup
+    justifyContent="spaceBetween"
+  >
+    <EuiFlexItem
+      grow={false}
+    >
+      <div />
+    </EuiFlexItem>
+    <EuiFlexItem
+      grow={false}
+    >
+      <div>
+        <mockConstructor
+          application={
+            Object {
+              "capabilities": Object {
+                "advancedSettings": Object {
+                  "show": true,
+                },
+              },
+            }
+          }
+        >
+          <EuiButtonEmpty
+            className="pageFooter__button"
+            data-test-subj="allPlugins"
+            flush="left"
+            href="/app/home#/feature_directory"
+            iconType="apps"
+            size="xs"
+          >
+            <FormattedMessage
+              defaultMessage="View app directory"
+              id="kibana-react.pageFooter.appDirectoryButtonLabel"
+              values={Object {}}
+            />
+          </EuiButtonEmpty>
+        </mockConstructor>
+      </div>
+    </EuiFlexItem>
+  </EuiFlexGroup>
+</footer>
+`;
diff --git a/src/plugins/kibana_react/public/page/page_footer/_page_footer.scss b/src/plugins/kibana_react/public/page/page_footer/_page_footer.scss
new file mode 100644
index 0000000000000..9a9a48716e241
--- /dev/null
+++ b/src/plugins/kibana_react/public/page/page_footer/_page_footer.scss
@@ -0,0 +1,23 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+// Accounting for no `flush="both"` prop on EuiButtonEmpty
+.pageFooter__button {
+  margin-right: 0;
+}
diff --git a/src/plugins/home/public/application/components/_manage_data.scss b/src/plugins/kibana_react/public/page/page_footer/index.scss
similarity index 90%
rename from src/plugins/home/public/application/components/_manage_data.scss
rename to src/plugins/kibana_react/public/page/page_footer/index.scss
index 389d8c8b3bf0f..b4d5a534d880a 100644
--- a/src/plugins/home/public/application/components/_manage_data.scss
+++ b/src/plugins/kibana_react/public/page/page_footer/index.scss
@@ -17,6 +17,4 @@
  * under the License.
  */
 
-.homDataManage__content .euiIcon__fillSecondary {
-  fill: $euiColorDarkestShade;
-}
+@import './page_footer';
diff --git a/src/plugins/kibana_react/public/overview_page/overview_header/index.ts b/src/plugins/kibana_react/public/page/page_footer/index.ts
similarity index 95%
rename from src/plugins/kibana_react/public/overview_page/overview_header/index.ts
rename to src/plugins/kibana_react/public/page/page_footer/index.ts
index 9f49cbf836a2c..6256394b3f2ff 100644
--- a/src/plugins/kibana_react/public/overview_page/overview_header/index.ts
+++ b/src/plugins/kibana_react/public/page/page_footer/index.ts
@@ -17,4 +17,4 @@
  * under the License.
  */
 
-export * from './overview_header';
+export * from './page_footer';
diff --git a/src/plugins/kibana_react/public/overview_page/overview_footer/overview_footer.test.tsx b/src/plugins/kibana_react/public/page/page_footer/page_footer.test.tsx
similarity index 89%
rename from src/plugins/kibana_react/public/overview_page/overview_footer/overview_footer.test.tsx
rename to src/plugins/kibana_react/public/page/page_footer/page_footer.test.tsx
index 4422b6fdb3545..4b5510c07cabf 100644
--- a/src/plugins/kibana_react/public/overview_page/overview_footer/overview_footer.test.tsx
+++ b/src/plugins/kibana_react/public/page/page_footer/page_footer.test.tsx
@@ -18,7 +18,7 @@
  */
 
 import React from 'react';
-import { OverviewFooter } from './overview_footer';
+import { PageFooter } from './page_footer';
 import { shallowWithIntl } from 'test_utils/enzyme_helpers';
 
 jest.mock('../../../../../../src/plugins/kibana_react/public', () => ({
@@ -34,9 +34,9 @@ jest.mock('../../../../../../src/plugins/kibana_react/public', () => ({
 
 afterEach(() => jest.clearAllMocks());
 
-describe('OverviewFooter', () => {
+describe('PageFooter', () => {
   test('render', () => {
-    const component = shallowWithIntl(<OverviewFooter path="new-default-route" />);
+    const component = shallowWithIntl(<PageFooter path="new-default-route" />);
     expect(component).toMatchSnapshot();
   });
 });
diff --git a/src/plugins/kibana_react/public/overview_page/overview_footer/overview_footer.tsx b/src/plugins/kibana_react/public/page/page_footer/page_footer.tsx
similarity index 68%
rename from src/plugins/kibana_react/public/overview_page/overview_footer/overview_footer.tsx
rename to src/plugins/kibana_react/public/page/page_footer/page_footer.tsx
index 3a61eb989024a..6deb2bf0124ab 100644
--- a/src/plugins/kibana_react/public/overview_page/overview_footer/overview_footer.tsx
+++ b/src/plugins/kibana_react/public/page/page_footer/page_footer.tsx
@@ -35,7 +35,7 @@ interface Props {
   path: string;
 }
 
-export const OverviewFooter: FC<Props> = ({ path }) => {
+export const PageFooter: FC<Props> = ({ path }) => {
   const [defaultRoute, setDefaultRoute] = useUiSetting$<string>('defaultRoute');
   const {
     services: {
@@ -51,23 +51,27 @@ export const OverviewFooter: FC<Props> = ({ path }) => {
     defaultRoute === path ? (
       <RedirectAppLinks application={application}>
         <EuiButtonEmpty
-          iconType="home"
+          className="pageFooter__button"
+          flush="left"
           href={'/app/management/kibana/settings#defaultRoute'}
+          iconType="home"
           size="xs"
         >
           <FormattedMessage
-            id="kibana-react.overviewFooter.changeHomeRouteLink"
+            id="kibana-react.pageFooter.changeHomeRouteLink"
             defaultMessage="Display a different page on log in"
           />
         </EuiButtonEmpty>
       </RedirectAppLinks>
     ) : (
       <EuiButtonEmpty
+        className="pageFooter__button"
+        flush="left"
         iconType="home"
         onClick={() => {
           setDefaultRoute(path);
           toasts.addSuccess({
-            title: i18n.translate('kibana-react.overviewFooter.changeDefaultRouteSuccessToast', {
+            title: i18n.translate('kibana-react.pageFooter.changeDefaultRouteSuccessToast', {
               defaultMessage: 'Landing page updated',
             }),
           });
@@ -75,32 +79,37 @@ export const OverviewFooter: FC<Props> = ({ path }) => {
         size="xs"
       >
         <FormattedMessage
-          id="kibana-react.overviewFooter.makeDefaultRouteLink"
+          id="kibana-react.pageFooter.makeDefaultRouteLink"
           defaultMessage="Make this my landing page"
         />
       </EuiButtonEmpty>
     );
 
   return (
-    <footer className={`kbnOverviewFooter`}>
-      <EuiFlexGroup alignItems="center" justifyContent="spaceBetween">
+    <footer className="pageFooter">
+      <EuiFlexGroup justifyContent="spaceBetween">
         <EuiFlexItem grow={false}>
-          {isAdvancedSettingsEnabled ? defaultRoutebutton : null}
+          <div>{isAdvancedSettingsEnabled ? defaultRoutebutton : null}</div>
         </EuiFlexItem>
+
         <EuiFlexItem grow={false}>
-          <RedirectAppLinks application={application}>
-            <EuiButtonEmpty
-              data-test-subj="allPlugins"
-              href={'/app/home#/feature_directory'}
-              size="xs"
-              iconType="apps"
-            >
-              <FormattedMessage
-                id="kibana-react.overviewFooter.appDirectoryButtonLabel"
-                defaultMessage="View app directory"
-              />
-            </EuiButtonEmpty>
-          </RedirectAppLinks>
+          <div>
+            <RedirectAppLinks application={application}>
+              <EuiButtonEmpty
+                className="pageFooter__button"
+                data-test-subj="allPlugins"
+                flush="left"
+                href="/app/home#/feature_directory"
+                iconType="apps"
+                size="xs"
+              >
+                <FormattedMessage
+                  id="kibana-react.pageFooter.appDirectoryButtonLabel"
+                  defaultMessage="View app directory"
+                />
+              </EuiButtonEmpty>
+            </RedirectAppLinks>
+          </div>
         </EuiFlexItem>
       </EuiFlexGroup>
     </footer>
diff --git a/src/plugins/kibana_react/public/page/page_header/__snapshots__/page_header.test.tsx.snap b/src/plugins/kibana_react/public/page/page_header/__snapshots__/page_header.test.tsx.snap
new file mode 100644
index 0000000000000..a8170dfc75417
--- /dev/null
+++ b/src/plugins/kibana_react/public/page/page_header/__snapshots__/page_header.test.tsx.snap
@@ -0,0 +1,68 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`PageHeader render 1`] = `
+<header
+  className="pageHeader pageHeader--noOverlap"
+>
+  <div
+    className="pageHeader__inner"
+  >
+    <EuiFlexGroup>
+      <EuiFlexItem>
+        <EuiFlexGroup
+          gutterSize="m"
+          responsive={false}
+        >
+          <EuiFlexItem>
+            <EuiTitle
+              size="m"
+            >
+              <h1
+                id="pageHeader__title"
+              >
+                Page Title
+              </h1>
+            </EuiTitle>
+          </EuiFlexItem>
+        </EuiFlexGroup>
+      </EuiFlexItem>
+      <EuiFlexItem
+        grow={false}
+      >
+        <EuiFlexGroup
+          className="pageHeader__actions"
+          responsive={false}
+          wrap={true}
+        >
+          <EuiFlexItem
+            className="pageHeader__actionItem"
+            grow={false}
+          >
+            <mockConstructor
+              application={
+                Object {
+                  "capabilities": Object {
+                    "navLinks": Object {
+                      "dev_tools": true,
+                      "management": true,
+                    },
+                  },
+                }
+              }
+            >
+              <EuiButtonEmpty
+                className="pageHeader__actionButton"
+                flush="left"
+                href="/app/home#/tutorial_directory"
+                iconType="indexOpen"
+              >
+                Add data
+              </EuiButtonEmpty>
+            </mockConstructor>
+          </EuiFlexItem>
+        </EuiFlexGroup>
+      </EuiFlexItem>
+    </EuiFlexGroup>
+  </div>
+</header>
+`;
diff --git a/src/plugins/kibana_react/public/page/page_header/_page_header.scss b/src/plugins/kibana_react/public/page/page_header/_page_header.scss
new file mode 100644
index 0000000000000..d5168fe41c83b
--- /dev/null
+++ b/src/plugins/kibana_react/public/page/page_header/_page_header.scss
@@ -0,0 +1,38 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+.pageHeader {
+  background-color: $euiPageBackgroundColor;
+  border-bottom: $euiBorderWidthThin solid $euiColorLightShade;
+}
+
+.pageHeader__inner {
+  margin: 0 auto;
+  max-width: 1200px;
+  padding: $euiSizeXL $euiSize;
+
+  .pageHeader--hasOverlap & {
+    padding-bottom: $euiSizeXL + $euiSizeL;
+  }
+}
+
+// Accounting for no `flush="both"` prop on EuiButtonEmpty
+.pageHeader__actionButton {
+  margin-right: 0;
+}
diff --git a/src/plugins/kibana_react/public/page/page_header/index.scss b/src/plugins/kibana_react/public/page/page_header/index.scss
new file mode 100644
index 0000000000000..626fd36e29c17
--- /dev/null
+++ b/src/plugins/kibana_react/public/page/page_header/index.scss
@@ -0,0 +1,20 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+@import './page_header';
diff --git a/src/plugins/kibana_react/public/overview_page/overview_footer/index.ts b/src/plugins/kibana_react/public/page/page_header/index.ts
similarity index 95%
rename from src/plugins/kibana_react/public/overview_page/overview_footer/index.ts
rename to src/plugins/kibana_react/public/page/page_header/index.ts
index e0be7965a12f7..9c746fbb1ae69 100644
--- a/src/plugins/kibana_react/public/overview_page/overview_footer/index.ts
+++ b/src/plugins/kibana_react/public/page/page_header/index.ts
@@ -17,4 +17,4 @@
  * under the License.
  */
 
-export * from './overview_footer';
+export * from './page_header';
diff --git a/src/plugins/kibana_react/public/overview_page/overview_header/overview_header.test.tsx b/src/plugins/kibana_react/public/page/page_header/page_header.test.tsx
similarity index 86%
rename from src/plugins/kibana_react/public/overview_page/overview_header/overview_header.test.tsx
rename to src/plugins/kibana_react/public/page/page_header/page_header.test.tsx
index 3755af25b83eb..8f86e4d626ee8 100644
--- a/src/plugins/kibana_react/public/overview_page/overview_header/overview_header.test.tsx
+++ b/src/plugins/kibana_react/public/page/page_header/page_header.test.tsx
@@ -18,7 +18,7 @@
  */
 
 import React from 'react';
-import { OverviewHeader } from './overview_header';
+import { PageHeader } from './page_header';
 import { shallowWithIntl } from 'test_utils/enzyme_helpers';
 
 jest.mock('../../../../../../src/plugins/kibana_react/public', () => ({
@@ -32,11 +32,11 @@ jest.mock('../../../../../../src/plugins/kibana_react/public', () => ({
 
 afterAll(() => jest.clearAllMocks());
 
-const mockTitle = <h1>Page Title</h1>;
+const mockTitle = 'Page Title';
 
-describe('OverviewHeader', () => {
+describe('PageHeader', () => {
   test('render', () => {
-    const component = shallowWithIntl(<OverviewHeader title={mockTitle} />);
+    const component = shallowWithIntl(<PageHeader title={mockTitle} />);
     expect(component).toMatchSnapshot();
   });
 });
diff --git a/src/plugins/kibana_react/public/page/page_header/page_header.tsx b/src/plugins/kibana_react/public/page/page_header/page_header.tsx
new file mode 100644
index 0000000000000..453e5c79e2ca0
--- /dev/null
+++ b/src/plugins/kibana_react/public/page/page_header/page_header.tsx
@@ -0,0 +1,141 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import React, { FC } from 'react';
+import {
+  EuiButtonEmpty,
+  EuiFlexGroup,
+  EuiFlexItem,
+  EuiIcon,
+  EuiTitle,
+  IconType,
+} from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { CoreStart } from 'kibana/public';
+import { RedirectAppLinks, useKibana } from '../../../../../../src/plugins/kibana_react/public';
+
+import './index.scss';
+
+interface Props {
+  hideToolbar?: boolean;
+  iconType?: IconType;
+  overlap?: boolean;
+  showDevToolsLink?: boolean;
+  showManagementLink?: boolean;
+  title: JSX.Element | string;
+}
+
+export const PageHeader: FC<Props> = ({
+  hideToolbar,
+  iconType,
+  overlap,
+  showDevToolsLink,
+  showManagementLink,
+  title,
+}) => {
+  const {
+    services: { application },
+  } = useKibana<CoreStart>();
+
+  const {
+    management: isManagementEnabled,
+    dev_tools: isDevToolsEnabled,
+  } = application.capabilities.navLinks;
+
+  return (
+    <header
+      className={`pageHeader ${overlap ? 'pageHeader--hasOverlap' : 'pageHeader--noOverlap'}`}
+    >
+      <div className="pageHeader__inner">
+        <EuiFlexGroup>
+          <EuiFlexItem>
+            <EuiFlexGroup gutterSize="m" responsive={false}>
+              {iconType && (
+                <EuiFlexItem grow={false}>
+                  <EuiIcon size="xxl" type={iconType} />
+                </EuiFlexItem>
+              )}
+
+              <EuiFlexItem>
+                <EuiTitle size="m">
+                  <h1 id="pageHeader__title">{title}</h1>
+                </EuiTitle>
+              </EuiFlexItem>
+            </EuiFlexGroup>
+          </EuiFlexItem>
+
+          {!hideToolbar && (
+            <EuiFlexItem grow={false}>
+              <EuiFlexGroup className="pageHeader__actions" responsive={false} wrap>
+                <EuiFlexItem className="pageHeader__actionItem" grow={false}>
+                  <RedirectAppLinks application={application}>
+                    <EuiButtonEmpty
+                      className="pageHeader__actionButton"
+                      flush="left"
+                      href={'/app/home#/tutorial_directory'}
+                      iconType="indexOpen"
+                    >
+                      {i18n.translate('kibana-react.pageHeader.addDataButtonLabel', {
+                        defaultMessage: 'Add data',
+                      })}
+                    </EuiButtonEmpty>
+                  </RedirectAppLinks>
+                </EuiFlexItem>
+
+                {showManagementLink && isManagementEnabled ? (
+                  <EuiFlexItem className="pageHeader__actionItem" grow={false}>
+                    <RedirectAppLinks application={application}>
+                      <EuiButtonEmpty
+                        className="pageHeader__actionButton"
+                        flush="left"
+                        iconType="gear"
+                        href={'/app/management'}
+                      >
+                        {i18n.translate('kibana-react.pageHeader.stackManagementButtonLabel', {
+                          defaultMessage: 'Manage',
+                        })}
+                      </EuiButtonEmpty>
+                    </RedirectAppLinks>
+                  </EuiFlexItem>
+                ) : null}
+
+                {showDevToolsLink && isDevToolsEnabled ? (
+                  <EuiFlexItem className="pageHeader__actionItem" grow={false}>
+                    <RedirectAppLinks application={application}>
+                      <EuiButtonEmpty
+                        className="pageHeader__actionButton"
+                        flush="left"
+                        iconType="wrench"
+                        href={'/app/dev_tools#/console'}
+                      >
+                        {i18n.translate('kibana-react.pageHeader.devToolsButtonLabel', {
+                          defaultMessage: 'Dev tools',
+                        })}
+                      </EuiButtonEmpty>
+                    </RedirectAppLinks>
+                  </EuiFlexItem>
+                ) : null}
+              </EuiFlexGroup>
+            </EuiFlexItem>
+          )}
+        </EuiFlexGroup>
+      </div>
+    </header>
+  );
+};