diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/app_search.png b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/app_search.png
index 6cf0639167e2fe..fc22f35d04037e 100644
Binary files a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/app_search.png and b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/app_search.png differ
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/bg_enterprise_search.png b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/bg_enterprise_search.png
deleted file mode 100644
index 1b5e1e489fd96c..00000000000000
Binary files a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/bg_enterprise_search.png and /dev/null differ
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/workplace_search.png b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/workplace_search.png
index 984662b65cb5d8..7ad991f1047e39 100644
Binary files a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/workplace_search.png and b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/assets/workplace_search.png differ
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/license_callout/license_callout.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/license_callout/license_callout.tsx
index f9f329c8591102..0611c5f5ca7a3d 100644
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/license_callout/license_callout.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/license_callout/license_callout.tsx
@@ -23,7 +23,7 @@ export const LicenseCallout: React.FC = () => {
   if (hasPlatinumLicense && !isTrial) return null;
 
   return (
-    <EuiPanel hasShadow={false} hasBorder className="productCard" paddingSize="l">
+    <EuiPanel hasBorder color="transparent" paddingSize="l">
       <EuiFlexGroup gutterSize="s" alignItems="center" justifyContent="spaceBetween">
         <EuiFlexItem grow={7}>
           <EuiText>
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_card/product_card.scss b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_card/product_card.scss
index cac03dc0535525..26b974f4c84d45 100644
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_card/product_card.scss
+++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_card/product_card.scss
@@ -6,54 +6,10 @@
  */
 
 .productCard {
-  margin: $euiSizeS;
-
   &__imageContainer {
-    max-height: 115px;
-    overflow: hidden;
-    background-color: #0076CC;
-
-    @include euiBreakpoint('s', 'm', 'l', 'xl') {
-      max-height: none;
-    }
-  }
-
-  &__image {
-    width: 100%;
-    height: auto;
-  }
-
-  .euiCard__content {
-    max-width: 350px;
-    margin-top: $euiSizeL;
-
-    @include euiBreakpoint('s', 'm', 'l', 'xl') {
-      margin-top: $euiSizeXL;
-    }
-  }
-
-  .euiCard__title {
-    margin-bottom: $euiSizeM;
-    font-weight: $euiFontWeightBold;
-
-    @include euiBreakpoint('s', 'm', 'l', 'xl') {
-      margin-bottom: $euiSizeL;
-      font-size: $euiSizeL;
-    }
-  }
-
-  .euiCard__description {
-    font-weight: $euiFontWeightMedium;
-    color: $euiColorMediumShade;
-    margin-bottom: $euiSize;
-  }
-
-  .euiCard__footer {
-    margin-bottom: $euiSizeS;
-
-    @include euiBreakpoint('s', 'm', 'l', 'xl') {
-      margin-bottom: $euiSizeM;
-      font-size: $euiSizeL;
+    @include euiBreakpoint('xs') {
+      max-height: 115px;
+      overflow: hidden;
     }
   }
 }
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_selector/product_selector.test.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_selector/product_selector.test.tsx
index 90e16fe2d22fad..ee0209c1a124db 100644
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_selector/product_selector.test.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_selector/product_selector.test.tsx
@@ -11,8 +11,6 @@ import React from 'react';
 
 import { shallow } from 'enzyme';
 
-import { EuiPage } from '@elastic/eui';
-
 import { LicenseCallout } from '../license_callout';
 import { ProductCard } from '../product_card';
 import { SetupGuideCta } from '../setup_guide';
@@ -25,7 +23,6 @@ describe('ProductSelector', () => {
     setMockValues({ config: { host: '' } });
     const wrapper = shallow(<ProductSelector access={{}} />);
 
-    expect(wrapper.find(EuiPage).hasClass('enterpriseSearchOverview')).toBe(true);
     expect(wrapper.find(ProductCard)).toHaveLength(2);
     expect(wrapper.find(SetupGuideCta)).toHaveLength(1);
     expect(wrapper.find(LicenseCallout)).toHaveLength(0);
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_selector/product_selector.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_selector/product_selector.tsx
index 32ca131d6c835e..f42a043e7cd812 100644
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_selector/product_selector.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/product_selector/product_selector.tsx
@@ -9,20 +9,14 @@ import React from 'react';
 
 import { useValues } from 'kea';
 
-import {
-  EuiPage,
-  EuiPageBody,
-  EuiPageHeader,
-  EuiPageHeaderSection,
-  EuiPageContentBody,
-  EuiFlexGroup,
-  EuiFlexItem,
-  EuiSpacer,
-  EuiTitle,
-  EuiText,
-} from '@elastic/eui';
+import { EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 
+import {
+  KibanaPageTemplate,
+  KibanaPageTemplateSolutionNavAvatar,
+  NO_DATA_PAGE_TEMPLATE_PROPS,
+} from '../../../../../../../../src/plugins/kibana_react/public';
 import { APP_SEARCH_PLUGIN, WORKPLACE_SEARCH_PLUGIN } from '../../../../../common/constants';
 import { KibanaLogic } from '../../../shared/kibana';
 import { SetEnterpriseSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
@@ -51,52 +45,53 @@ export const ProductSelector: React.FC<ProductSelectorProps> = ({ access }) => {
   const shouldShowWorkplaceSearchCard = !config.host || hasWorkplaceSearchAccess;
 
   return (
-    <EuiPage restrictWidth className="enterpriseSearchOverview">
+    <KibanaPageTemplate {...NO_DATA_PAGE_TEMPLATE_PROPS}>
       <SetPageChrome />
       <SendTelemetry action="viewed" metric="overview" />
+      <TrialCallout />
+      <EuiText textAlign="center">
+        <KibanaPageTemplateSolutionNavAvatar
+          name="Enterprise Search"
+          iconType="logoEnterpriseSearch"
+          size="xxl"
+        />
+
+        <EuiSpacer />
+
+        <h1>
+          {i18n.translate('xpack.enterpriseSearch.overview.heading', {
+            defaultMessage: 'Welcome to Elastic Enterprise Search',
+          })}
+        </h1>
+        <p>
+          {config.host
+            ? i18n.translate('xpack.enterpriseSearch.overview.subheading', {
+                defaultMessage: 'Add search to your app or organization.',
+              })
+            : i18n.translate('xpack.enterpriseSearch.overview.setupHeading', {
+                defaultMessage: 'Choose a product to set up and get started.',
+              })}
+        </p>
+      </EuiText>
+
+      <EuiSpacer size="xxl" />
+
+      <EuiFlexGroup justifyContent="center" gutterSize="xl">
+        {shouldShowAppSearchCard && (
+          <EuiFlexItem grow={false}>
+            <ProductCard product={APP_SEARCH_PLUGIN} image={AppSearchImage} />
+          </EuiFlexItem>
+        )}
+        {shouldShowWorkplaceSearchCard && (
+          <EuiFlexItem grow={false}>
+            <ProductCard product={WORKPLACE_SEARCH_PLUGIN} image={WorkplaceSearchImage} />
+          </EuiFlexItem>
+        )}
+      </EuiFlexGroup>
+
+      <EuiSpacer size="xxl" />
 
-      <EuiPageBody>
-        <TrialCallout />
-        <EuiPageHeader>
-          <EuiPageHeaderSection className="enterpriseSearchOverview__header">
-            <EuiTitle size="l">
-              <h1>
-                {i18n.translate('xpack.enterpriseSearch.overview.heading', {
-                  defaultMessage: 'Welcome to Elastic Enterprise Search',
-                })}
-              </h1>
-            </EuiTitle>
-            <EuiSpacer />
-            <EuiText>
-              <p>
-                {config.host
-                  ? i18n.translate('xpack.enterpriseSearch.overview.subheading', {
-                      defaultMessage: 'Add search to your app or organization.',
-                    })
-                  : i18n.translate('xpack.enterpriseSearch.overview.setupHeading', {
-                      defaultMessage: 'Choose a product to set up and get started.',
-                    })}
-              </p>
-            </EuiText>
-          </EuiPageHeaderSection>
-        </EuiPageHeader>
-        <EuiPageContentBody>
-          <EuiFlexGroup justifyContent="center" gutterSize="xl">
-            {shouldShowAppSearchCard && (
-              <EuiFlexItem grow={false} className="enterpriseSearchOverview__card">
-                <ProductCard product={APP_SEARCH_PLUGIN} image={AppSearchImage} />
-              </EuiFlexItem>
-            )}
-            {shouldShowWorkplaceSearchCard && (
-              <EuiFlexItem grow={false} className="enterpriseSearchOverview__card">
-                <ProductCard product={WORKPLACE_SEARCH_PLUGIN} image={WorkplaceSearchImage} />
-              </EuiFlexItem>
-            )}
-          </EuiFlexGroup>
-          <EuiSpacer size="xxl" />
-          {config.host ? <LicenseCallout /> : <SetupGuideCta />}
-        </EuiPageContentBody>
-      </EuiPageBody>
-    </EuiPage>
+      {config.host ? <LicenseCallout /> : <SetupGuideCta />}
+    </KibanaPageTemplate>
   );
 };
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.scss b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.scss
index 913626fbbd795a..09e640d4de83d9 100644
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.scss
+++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.scss
@@ -6,20 +6,7 @@
  */
 
 .enterpriseSearchSetupCta {
-  margin: $euiSize auto $euiSizeXL;
-
-  // Clickable EuiPanel override - line panel up with product cards
-  &.euiPanel--isClickable {
-    width: calc(100% - #{$euiSize});
-  }
-
-  &__text {
-    max-width: $euiSize * 40;
-  }
-
   &__image {
-    display: block;
-    max-width: 100%;
     width: $euiSize * 10;
     margin: 0 auto;
 
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.test.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.test.tsx
index 659af6d23c6d09..dd18d0d59c056a 100644
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.test.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.test.tsx
@@ -16,6 +16,6 @@ describe('SetupGuideCta', () => {
     const wrapper = shallow(<SetupGuideCta />);
 
     expect(wrapper.find('.enterpriseSearchSetupCta')).toHaveLength(1);
-    expect(wrapper.find('img')).toHaveLength(1);
+    expect(wrapper.find('EuiImage')).toHaveLength(1);
   });
 });
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.tsx
index 0c90f7b998bf88..346477b08dbb96 100644
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/setup_guide/setup_guide_cta.tsx
@@ -7,7 +7,7 @@
 
 import React from 'react';
 
-import { EuiFlexGroup, EuiFlexItem, EuiTitle, EuiText } from '@elastic/eui';
+import { EuiFlexGroup, EuiFlexItem, EuiTitle, EuiText, EuiImage } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 
 import { EuiPanelTo } from '../../../shared/react_router_helpers';
@@ -22,9 +22,11 @@ export const SetupGuideCta: React.FC = () => (
     paddingSize="l"
     className="enterpriseSearchSetupCta"
     data-test-subj="setupGuideLink"
+    hasBorder
+    color="transparent"
   >
     <EuiFlexGroup alignItems="center" justifyContent="spaceBetween">
-      <EuiFlexItem className="enterpriseSearchSetupCta__text">
+      <EuiFlexItem>
         <EuiTitle size="s">
           <h2>{PRODUCT_SELECTOR_CALLOUT_HEADING}</h2>
         </EuiTitle>
@@ -36,7 +38,7 @@ export const SetupGuideCta: React.FC = () => (
         </EuiText>
       </EuiFlexItem>
       <EuiFlexItem grow={false}>
-        <img src={CtaImage} alt="" className="enterpriseSearchSetupCta__image" />
+        <EuiImage src={CtaImage} alt="" className="enterpriseSearchSetupCta__image" />
       </EuiFlexItem>
     </EuiFlexGroup>
   </EuiPanelTo>
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/index.scss b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/index.scss
deleted file mode 100644
index 4be8d7322b4c8e..00000000000000
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/index.scss
+++ /dev/null
@@ -1,41 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0; you may not use this file except in compliance with the Elastic License
- * 2.0.
- */
-
-.enterpriseSearchOverview {
-  padding-top: 78px;
-  background-image: url('./assets/bg_enterprise_search.png');
-  background-repeat: no-repeat;
-  background-size: 670px;
-  background-position: center -27px;
-
-  @include euiBreakpoint('m', 'l', 'xl') {
-    padding-top: 158px;
-    background-size: 1160px;
-    background-position: center -48px;
-  }
-
-  &__header {
-    text-align: center;
-    margin: auto;
-    @include euiBreakpoint('m', 'l', 'xl') {
-      margin-bottom: $euiSizeL;
-    }
-  }
-
-  // EUI override
-  .euiTitle + .euiTitle {
-    margin-top: 0;
-
-    @include euiBreakpoint('m', 'l', 'xl') {
-      margin-top: $euiSizeS;
-    }
-  }
-
-  .enterpriseSearchOverview__card {
-    flex-basis: 50%;
-  }
-}
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/index.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/index.tsx
index b21e46429672af..b1aab0dacabdee 100644
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/index.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/index.tsx
@@ -19,8 +19,6 @@ import { ProductSelector } from './components/product_selector';
 import { SetupGuide } from './components/setup_guide';
 import { ROOT_PATH, SETUP_GUIDE_PATH } from './routes';
 
-import './index.scss';
-
 export const EnterpriseSearch: React.FC<InitialAppData> = ({ access = {} }) => {
   const { errorConnecting } = useValues(HttpLogic);
   const { config } = useValues(KibanaLogic);
diff --git a/x-pack/plugins/enterprise_search/public/applications/index.test.tsx b/x-pack/plugins/enterprise_search/public/applications/index.test.tsx
index cb73686eb4c5ba..5a82f15a6cf043 100644
--- a/x-pack/plugins/enterprise_search/public/applications/index.test.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/index.test.tsx
@@ -64,7 +64,7 @@ describe('renderApp', () => {
 
     it('renders EnterpriseSearch', () => {
       mount(EnterpriseSearch);
-      expect(mockContainer.querySelector('.enterpriseSearchOverview')).not.toBeNull();
+      expect(mockContainer.querySelector('.kbnPageTemplate')).not.toBeNull();
     });
 
     it('renders AppSearch', () => {