diff --git a/src/content/app/tools/shared/components/tools-top-bar/ToolsTopBar.module.css b/src/content/app/tools/shared/components/tools-top-bar/ToolsTopBar.module.css
index 56bee2cac6..988b0e4acb 100644
--- a/src/content/app/tools/shared/components/tools-top-bar/ToolsTopBar.module.css
+++ b/src/content/app/tools/shared/components/tools-top-bar/ToolsTopBar.module.css
@@ -1,5 +1,7 @@
 .topBar {
   min-height: 74px;
+  display: flex;
+  flex-direction: column;
   background-color: var(--color-light-grey);
   padding: 24px 30px 20px;
   box-shadow: 0 3px 5px var(--global-box-shadow-color);
diff --git a/src/content/app/tools/vep/VepPage.tsx b/src/content/app/tools/vep/VepPage.tsx
new file mode 100644
index 0000000000..c06d707ebe
--- /dev/null
+++ b/src/content/app/tools/vep/VepPage.tsx
@@ -0,0 +1,61 @@
+/**
+ * See the NOTICE file distributed with this work for additional information
+ * regarding copyright ownership.
+ *
+ * Licensed 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 { lazy, useEffect } from 'react';
+
+import { useAppDispatch } from 'src/store';
+import useHasMounted from 'src/shared/hooks/useHasMounted';
+
+import { updatePageMeta } from 'src/shared/state/page-meta/pageMetaSlice';
+
+import type { ServerFetch } from 'src/routes/routesConfig';
+
+const VepPageContent = lazy(() => import('./VepPageContent'));
+
+// Copied these from the current Ensembl site; will probably need changing in the future.
+const pageTitle = 'Ensembl Variant Effect Predictor (VEP)';
+const pageDescription = `
+VEP determines the effect of your variants (SNPs, insertions, deletions, CNVs or structural variants)
+on genes, transcripts, and protein sequence, as well as regulatory regions.
+`;
+
+const VepPage = () => {
+  const hasMounted = useHasMounted();
+  const dispatch = useAppDispatch();
+
+  useEffect(() => {
+    dispatch(
+      updatePageMeta({
+        title: pageTitle,
+        description: pageDescription
+      })
+    );
+  }, []);
+
+  return hasMounted ? <VepPageContent /> : null;
+};
+
+export default VepPage;
+
+// not really fetching anything; just setting page meta
+export const serverFetch: ServerFetch = async (params) => {
+  params.store.dispatch(
+    updatePageMeta({
+      title: pageTitle,
+      description: pageDescription
+    })
+  );
+};
diff --git a/src/content/app/tools/vep/VepPageContent.tsx b/src/content/app/tools/vep/VepPageContent.tsx
new file mode 100644
index 0000000000..7d8ba78f78
--- /dev/null
+++ b/src/content/app/tools/vep/VepPageContent.tsx
@@ -0,0 +1,57 @@
+/**
+ * See the NOTICE file distributed with this work for additional information
+ * regarding copyright ownership.
+ *
+ * Licensed 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 { Route, Routes } from 'react-router-dom';
+
+import VepAppBar from './components/vep-app-bar/VepAppBar';
+import VepTopBar from './components/vep-top-bar/VepTopBar';
+import VepForm from './views/vep-form/VepForm';
+import { NotFoundErrorScreen } from 'src/shared/components/error-screen';
+
+const VepPageContent = () => {
+  return (
+    <div>
+      <VepAppBar />
+      <Main />
+    </div>
+  );
+};
+
+const Main = () => {
+  return (
+    <div>
+      <VepTopBar />
+
+      <Routes>
+        <Route index={true} element={<VepForm />} />
+        <Route
+          path="unviewed-submissions"
+          element={<div>List of unviewed submissions</div>}
+        />
+        <Route path="submissions">
+          <Route index={true} element={<div>List of viewed submissions</div>} />
+          <Route
+            path=":submissionId"
+            element={<div>Results of a single VEP analysis</div>}
+          />
+        </Route>
+        <Route path="*" element={<NotFoundErrorScreen />} />
+      </Routes>
+    </div>
+  );
+};
+
+export default VepPageContent;
diff --git a/src/content/app/tools/vep/components/form-section/FormSection.module.css b/src/content/app/tools/vep/components/form-section/FormSection.module.css
new file mode 100644
index 0000000000..7149be777f
--- /dev/null
+++ b/src/content/app/tools/vep/components/form-section/FormSection.module.css
@@ -0,0 +1,9 @@
+.container {
+  border-width: 1px;
+  border-style: solid;
+  border-color: var(--form-section-border-color, var(--color-medium-light-grey));
+}
+
+.container + .container {
+  border-top: none;
+}
diff --git a/src/content/app/tools/vep/components/form-section/FormSection.tsx b/src/content/app/tools/vep/components/form-section/FormSection.tsx
new file mode 100644
index 0000000000..dadcc44166
--- /dev/null
+++ b/src/content/app/tools/vep/components/form-section/FormSection.tsx
@@ -0,0 +1,56 @@
+/**
+ * See the NOTICE file distributed with this work for additional information
+ * regarding copyright ownership.
+ *
+ * Licensed 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 classNames from 'classnames';
+
+import type { ReactNode } from 'react';
+
+import styles from './FormSection.module.css';
+
+/**
+ * This component has first appeared in VEP submission form;
+ * but it is almost a certainty that it will be used in other places as well.
+ *
+ * There already exist two similar components: Accordion and ExpandableSection;
+ * however, this new components doesn't seem to fit either of those:
+ * - Both the Accordion and the ExpandableSection components have a predefined
+ *   toggle element (an upwards- or downwards-pointing chevron); and in case of
+ *   the Accordion, the whole area of the closed section acts as a button.
+ *   In contrast, this new component can have anything in the right-hand corner.
+ * - Both the Accordion and the ExpandableSection components have a clear
+ *   distinction between the "closed" (collapsed) and the "opened" (expanded)
+ *   states. In contrast, this new component can show none of its content,
+ *   a little bit of its content, or its full content (see e.g. behaviour of
+ *   a VEP options section, which may show none of the options, some of the options,
+ *   or all options)
+ *
+ * Here is what this component needs to be able to do:
+ * - It has a border; yet, when it is immediately followed by another FormSection,
+ *   their adjacent borders should visually collapse into one.
+ */
+
+type Props = {
+  children: ReactNode;
+  className?: string;
+};
+
+const FormSection = (props: Props) => {
+  const componentClasses = classNames(styles.container, props.className);
+
+  return <div className={componentClasses}>{props.children}</div>;
+};
+
+export default FormSection;
diff --git a/src/content/app/tools/vep/components/vep-app-bar/VepAppBar.tsx b/src/content/app/tools/vep/components/vep-app-bar/VepAppBar.tsx
new file mode 100644
index 0000000000..e746ca4451
--- /dev/null
+++ b/src/content/app/tools/vep/components/vep-app-bar/VepAppBar.tsx
@@ -0,0 +1,50 @@
+/**
+ * See the NOTICE file distributed with this work for additional information
+ * regarding copyright ownership.
+ *
+ * Licensed 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 { useAppSelector } from 'src/store';
+import { getEnabledCommittedSpecies } from 'src/content/app/species-selector/state/species-selector-general-slice/speciesSelectorGeneralSelectors';
+
+import AppBar, { AppName } from 'src/shared/components/app-bar/AppBar';
+import SpeciesManagerIndicator from 'src/shared/components/species-manager-indicator/SpeciesManagerIndicator';
+import { SelectedSpecies } from 'src/shared/components/selected-species';
+import SpeciesTabsSlider from 'src/shared/components/species-tabs-slider/SpeciesTabsSlider';
+import { AppName as AppNameText } from 'src/global/globalConfig';
+
+const VepAppBar = () => {
+  return (
+    <AppBar
+      mainContent={<SpeciesTabs />}
+      topRight={<SpeciesManagerIndicator />}
+      topLeft={<AppName>{AppNameText.TOOLS}</AppName>}
+    />
+  );
+};
+
+const SpeciesTabs = () => {
+  const speciesList = useAppSelector(getEnabledCommittedSpecies);
+
+  const speciesTabs = speciesList.map((species) => (
+    <SelectedSpecies
+      key={species.genome_id}
+      species={species}
+      disabled={true}
+    />
+  ));
+
+  return <SpeciesTabsSlider>{speciesTabs}</SpeciesTabsSlider>;
+};
+
+export default VepAppBar;
diff --git a/src/content/app/tools/vep/components/vep-top-bar/VepTopBar.module.css b/src/content/app/tools/vep/components/vep-top-bar/VepTopBar.module.css
new file mode 100644
index 0000000000..5def92bfd0
--- /dev/null
+++ b/src/content/app/tools/vep/components/vep-top-bar/VepTopBar.module.css
@@ -0,0 +1,64 @@
+.grid {
+  display: grid;
+  flex-grow: 1;
+  align-items: center;
+  grid-template-columns:
+    [vep-logo] max-content
+    [form-title] max-content
+    [transcript-set] auto
+    [submit-button] min-content
+    [vep-version] auto
+    [job-lists-navigation] auto;
+  column-gap: 32px;
+  white-space: nowrap;
+}
+
+.logo {
+  grid-column: vep-logo;
+  height: 16px;
+}
+
+.runAJob {
+  grid-column: form-title;
+  margin-left: 20px;
+  font-weight: var(--font-weight-bold);
+}
+
+.transcriptSet {
+  grid-column: transcript-set;
+  justify-self: end;
+}
+
+.transcriptSetSelector {
+  margin-left: 20px;
+  min-width: 300px;
+}
+
+.submit {
+  grid-column: submit-button;
+}
+
+.vepVersion {
+  grid-column: vep-version;
+  justify-self: end;
+  display: flex;
+  align-items: baseline;
+  white-space: pre;
+  color: var(--color-medium-dark-grey);
+}
+
+.vepVersion svg {
+  height: 11px;
+  margin-right: 0.6ch;
+  fill: var(--color-medium-dark-grey);
+}
+
+.vepVersion span {
+  color: var(--color-black);
+}
+
+.jobListsNavigation {
+  grid-column: job-lists-navigation;
+  display: flex;
+  column-gap: 12px;
+}
diff --git a/src/content/app/tools/vep/components/vep-top-bar/VepTopBar.tsx b/src/content/app/tools/vep/components/vep-top-bar/VepTopBar.tsx
new file mode 100644
index 0000000000..452de41b01
--- /dev/null
+++ b/src/content/app/tools/vep/components/vep-top-bar/VepTopBar.tsx
@@ -0,0 +1,60 @@
+/**
+ * See the NOTICE file distributed with this work for additional information
+ * regarding copyright ownership.
+ *
+ * Licensed 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 ToolsTopBar from 'src/content/app/tools/shared/components/tools-top-bar/ToolsTopBar';
+import { PrimaryButton } from 'src/shared/components/button/Button';
+import Logotype from 'static/img/brand/logotype.svg';
+import SimpleSelect from 'src/shared/components/simple-select/SimpleSelect';
+import ButtonLink from 'src/shared/components/button-link/ButtonLink';
+
+import logoUrl from 'static/img/tools/vep/ensembl-vep.svg?url';
+
+import styles from './VepTopBar.module.css';
+
+const VepTopBar = () => {
+  return (
+    <ToolsTopBar>
+      <div className={styles.grid}>
+        <img src={logoUrl} alt="Ensembl VEP logo" className={styles.logo} />
+        <div className={styles.runAJob}>Run a job</div>
+        <div className={styles.transcriptSet}>
+          Transcript set
+          <SimpleSelect
+            options={[{ label: 'Select', value: 'none' }]}
+            disabled={true}
+            className={styles.transcriptSetSelector}
+          />
+        </div>
+        <PrimaryButton disabled={true}>Run</PrimaryButton>
+        <div className={styles.vepVersion}>
+          <Logotype />
+          <span>Variant effect predictor </span>
+          v111
+        </div>
+        <div className={styles.jobListsNavigation}>
+          <ButtonLink to="" isDisabled={true}>
+            Unviewed jobs
+          </ButtonLink>
+          <ButtonLink to="" isDisabled={true}>
+            Jobs list
+          </ButtonLink>
+        </div>
+      </div>
+    </ToolsTopBar>
+  );
+};
+
+export default VepTopBar;
diff --git a/src/content/app/tools/vep/views/vep-form/VepForm.module.css b/src/content/app/tools/vep/views/vep-form/VepForm.module.css
new file mode 100644
index 0000000000..366f66ee26
--- /dev/null
+++ b/src/content/app/tools/vep/views/vep-form/VepForm.module.css
@@ -0,0 +1,73 @@
+.container {
+  margin-top: 22px;
+  margin-left: var(--double-standard-gutter);
+  margin-bottom: var(--global-padding-bottom);
+  max-width: 1160px;
+}
+
+/*
+*  THE TOPMOST AREA, ABOVE OTHER FORM SECTIONS
+*/
+.topmostAreaGrid {
+  --padding-side: 42px;
+  display: grid;
+  grid-template-columns: [submission-name-field] 1fr [form-reset] max-content;
+  align-items: end;
+  padding-left: var(--padding-side);
+  padding-right: var(--padding-side);
+  margin-bottom: 20px;
+}
+
+.submissionName {
+  grid-column: submission-name-field;
+  justify-self: start;
+  display: flex;
+  align-items: center;
+  column-gap: 12px;
+  font-weight: var(--font-weight-light);
+  font-size: 11px;
+  white-space: nowrap;
+}
+
+.resetForm {
+  grid-column: form-reset;
+}
+
+
+.formSection {
+  min-height: 62px;
+}
+
+/*
+*  TOP SECTIONS OF THE FORM
+*/
+
+/* Grid to use to display the regular content of the section, i.e. not the expanded content */
+.topFormSectionRegularGrid {
+  --column-gap: 20px;
+  --padding-side: 42px;
+  display: grid;
+  grid-template-columns:
+    [section-name] calc(152px - var(--column-gap))
+    [section-main-content] 1fr
+    [section-toggle] auto;
+  column-gap: var(--column-gap);
+  align-items: center;
+  height: 62px;
+}
+
+.topFormSectionName {
+  grid-column: section-name;
+  font-weight: var(--font-weight-light);
+  padding-left: var(--padding-side);
+}
+
+.topFormSectionMain {
+  grid-column: section-main-content;
+}
+
+.topFormSectionToggle {
+  grid-column: section-toggle;
+  padding-right: var(--padding-side);
+  display: flex;
+}
diff --git a/src/content/app/tools/vep/views/vep-form/VepForm.tsx b/src/content/app/tools/vep/views/vep-form/VepForm.tsx
new file mode 100644
index 0000000000..cc24cea26e
--- /dev/null
+++ b/src/content/app/tools/vep/views/vep-form/VepForm.tsx
@@ -0,0 +1,64 @@
+/**
+ * See the NOTICE file distributed with this work for additional information
+ * regarding copyright ownership.
+ *
+ * Licensed 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 FormSection from 'src/content/app/tools/vep/components/form-section/FormSection';
+import PlusButton from 'src/shared/components/plus-button/PlusButton';
+import TextButton from 'src/shared/components/text-button/TextButton';
+import ShadedInput from 'src/shared/components/input/ShadedInput';
+import { DeleteButtonWithLabel } from 'src/shared/components/delete-button/DeleteButton';
+
+import styles from './VepForm.module.css';
+
+const VepForm = () => {
+  return (
+    <div className={styles.container}>
+      <div className={styles.topmostAreaGrid}>
+        <div className={styles.submissionName}>
+          <label>Submission name</label>
+          <ShadedInput placeholder="Optional" />
+        </div>
+        <div className={styles.resetForm}>
+          <DeleteButtonWithLabel label="Reset" disabled={true} />
+        </div>
+      </div>
+
+      <FormSection className={styles.formSection}>
+        <div className={styles.topFormSectionRegularGrid}>
+          <div className={styles.topFormSectionName}>Species</div>
+          <div className={styles.topFormSectionMain}>
+            <TextButton>Select a species / assembly</TextButton>
+          </div>
+          <div className={styles.topFormSectionToggle}>
+            <PlusButton />
+          </div>
+        </div>
+      </FormSection>
+      <FormSection className={styles.formSection}>
+        <div className={styles.topFormSectionRegularGrid}>
+          <div className={styles.topFormSectionName}>Variants</div>
+          <div className={styles.topFormSectionMain}>
+            <TextButton disabled={true}>Add variants</TextButton>
+          </div>
+          <div className={styles.topFormSectionToggle}>
+            <PlusButton disabled={true} />
+          </div>
+        </div>
+      </FormSection>
+    </div>
+  );
+};
+
+export default VepForm;
diff --git a/src/header/launchbar/Launchbar.tsx b/src/header/launchbar/Launchbar.tsx
index f3f4fe09e0..8071d40e75 100644
--- a/src/header/launchbar/Launchbar.tsx
+++ b/src/header/launchbar/Launchbar.tsx
@@ -27,6 +27,7 @@ import LaunchbarButton from './LaunchbarButton';
 import SpeciesSelectorLaunchbarButton from './SpeciesSelectorLaunchbarButton';
 import EntityViewerLaunchbarButton from './EntityViewerLaunchbarButton';
 import BlastLaunchbarButton from './BlastLaunchbarButton';
+import VepLaunchbarButton from './VepLaunchbarButton';
 
 import Logotype from 'static/img/brand/logotype.svg';
 
@@ -63,6 +64,7 @@ const Launchbar = () => {
           </div>
           <div className={styles.category}>
             <BlastLaunchbarButton />
+            <VepLaunchbarButton />
           </div>
           <div className={styles.category}>
             <LaunchbarButton
diff --git a/src/header/launchbar/VepLaunchbarButton.tsx b/src/header/launchbar/VepLaunchbarButton.tsx
new file mode 100644
index 0000000000..d221f8bd2b
--- /dev/null
+++ b/src/header/launchbar/VepLaunchbarButton.tsx
@@ -0,0 +1,43 @@
+/**
+ * See the NOTICE file distributed with this work for additional information
+ * regarding copyright ownership.
+ *
+ * Licensed 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 { isProductionEnvironment } from 'src/shared/helpers/environment';
+
+import LaunchbarButtonWithNotification from './LaunchbarButtonWithNotification';
+import { VepIcon } from 'src/shared/components/app-icon';
+
+/**
+ * Similarly to BlastLaunchbarButton, this button will show a dot
+ * to indicate presence of running or unviewed jobs.
+ */
+
+const VepLaunchbarButton = () => {
+  if (isProductionEnvironment()) {
+    return null;
+  }
+
+  // TODO: add the code to enable notifications after submissions have been enabled
+  return (
+    <LaunchbarButtonWithNotification
+      path={'/vep'}
+      description="VEP"
+      icon={VepIcon}
+      notification={null}
+    />
+  );
+};
+
+export default VepLaunchbarButton;
diff --git a/src/routes/routesConfig.tsx b/src/routes/routesConfig.tsx
index 843e0d175b..ba1c3ed3aa 100644
--- a/src/routes/routesConfig.tsx
+++ b/src/routes/routesConfig.tsx
@@ -34,6 +34,9 @@ import EntityViewerPage, {
 import BlastPage, {
   serverFetch as blastServerFetch
 } from 'src/content/app/tools/blast/BlastPage';
+import VepPage, {
+  serverFetch as vepServerFetch
+} from 'src/content/app/tools/vep/VepPage';
 import AboutPage, {
   serverFetch as aboutPageServerFetch
 } from 'src/content/app/about/AboutPage';
@@ -85,6 +88,11 @@ const routes: RouteConfig[] = [
     element: <BlastPage />,
     serverFetch: blastServerFetch
   },
+  {
+    path: '/vep/*',
+    element: <VepPage />,
+    serverFetch: vepServerFetch
+  },
   {
     path: '/about/*',
     element: <AboutPage />,
diff --git a/src/shared/components/app-icon/AppIcon.module.css b/src/shared/components/app-icon/AppIcon.module.css
index c56d63f75d..888fb62700 100644
--- a/src/shared/components/app-icon/AppIcon.module.css
+++ b/src/shared/components/app-icon/AppIcon.module.css
@@ -49,6 +49,13 @@ get used when AppIcon is placed inside of the ImageButton component */
   height: 75%;
 }
 
+.vep svg {
+  --image-button-svg-width: 95%;
+  --image-button-svg-height: 95%;
+  width: 95%;
+  height: 95%;
+}
+
 .help svg {
   --image-button-svg-width: 70%;
   --image-button-svg-height: 70%;
diff --git a/src/shared/components/app-icon/VepIcon.tsx b/src/shared/components/app-icon/VepIcon.tsx
new file mode 100644
index 0000000000..3a0d14c3cb
--- /dev/null
+++ b/src/shared/components/app-icon/VepIcon.tsx
@@ -0,0 +1,34 @@
+/**
+ * See the NOTICE file distributed with this work for additional information
+ * regarding copyright ownership.
+ *
+ * Licensed 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 { memo } from 'react';
+import classNames from 'classnames';
+
+import SVGIcon from 'static/icons/icon_launchbar_vep.svg';
+
+import styles from './AppIcon.module.css';
+
+const BlastIcon = () => {
+  const elementClasses = classNames(styles.appIcon, styles.vep);
+
+  return (
+    <div className={elementClasses}>
+      <SVGIcon />
+    </div>
+  );
+};
+
+export default memo(BlastIcon);
diff --git a/src/shared/components/app-icon/index.ts b/src/shared/components/app-icon/index.ts
index 38da3367f9..6b6e2aed15 100644
--- a/src/shared/components/app-icon/index.ts
+++ b/src/shared/components/app-icon/index.ts
@@ -20,3 +20,4 @@ export { default as GlobalSearchIcon } from './GlobalSearchIcon';
 export { default as EntityViewerIcon } from './EntityViewerIcon';
 export { default as BlastIcon } from './BlastIcon';
 export { default as HelpIcon } from './HelpIcon';
+export { default as VepIcon } from './VepIcon';
diff --git a/src/shared/components/simple-select/SimpleSelect.module.css b/src/shared/components/simple-select/SimpleSelect.module.css
index 7ff7d1b022..f39012969d 100644
--- a/src/shared/components/simple-select/SimpleSelect.module.css
+++ b/src/shared/components/simple-select/SimpleSelect.module.css
@@ -43,3 +43,11 @@
     50% 100%
   ); /* idea from https://moderncss.dev/custom-select-styles-with-pure-css */
 }
+
+.disabled select {
+  border: var(--simple-select-disabled-border, 1px solid var(--color-grey));
+}
+
+.disabled::after {
+  background-color: var(--simple-select-disabled-arrowhead-color, var(--color-grey));
+}
diff --git a/src/shared/components/simple-select/SimpleSelect.tsx b/src/shared/components/simple-select/SimpleSelect.tsx
index 3193c82893..9163dfbfca 100644
--- a/src/shared/components/simple-select/SimpleSelect.tsx
+++ b/src/shared/components/simple-select/SimpleSelect.tsx
@@ -63,8 +63,7 @@ type OptionsSelectProps = CommonProps & OptionsSpecificProps;
 type OptionGroupsSelectProps = CommonProps & OptionGroupsSpecificProps;
 
 export type SimpleSelectProps = HTMLSelectProps &
-  (OptionsSelectProps | OptionGroupsSelectProps) &
-  CommonProps;
+  (OptionsSelectProps | OptionGroupsSelectProps);
 
 export type SimpleSelectMethods = {
   clear: () => void;
@@ -74,7 +73,12 @@ const SimpleSelect = (
   props: SimpleSelectProps,
   ref: ForwardedRef<{ clear: () => void }>
 ) => {
-  const { className, placeholder, ...otherProps } = props;
+  const {
+    className: classNameFromProps,
+    placeholder,
+    disabled,
+    ...otherProps
+  } = props;
   const selectRef = useRef<HTMLSelectElement | null>(null);
 
   useImperativeHandle(ref, () => ({
@@ -92,7 +96,11 @@ const SimpleSelect = (
     }
   }));
 
-  const selectClassnames = classNames(styles.select, className);
+  const selectClassnames = classNames(
+    styles.select,
+    { [styles.disabled]: disabled },
+    classNameFromProps
+  );
   const selectProps = pickBy(
     otherProps,
     (_, key) => !['options', 'optionGroups'].includes(key)
@@ -125,6 +133,7 @@ const SimpleSelect = (
       <select
         ref={selectRef}
         className={styles.selectResetDefaults}
+        disabled={disabled}
         {...selectProps}
       >
         {placeholder && renderPlaceholder(placeholder)}
diff --git a/src/shared/components/text-button/TextButton.module.css b/src/shared/components/text-button/TextButton.module.css
index 8afe0f354a..d9640d5c35 100644
--- a/src/shared/components/text-button/TextButton.module.css
+++ b/src/shared/components/text-button/TextButton.module.css
@@ -1,3 +1,7 @@
 .textButton {
   color: var(--text-button-color, var(--color-blue));
 }
+
+.disabled {
+  color: var(--text-button-disabled-color, var(--color-medium-dark-grey));
+}
diff --git a/src/shared/components/text-button/TextButton.tsx b/src/shared/components/text-button/TextButton.tsx
index 5e63230aa4..4c782be7a1 100644
--- a/src/shared/components/text-button/TextButton.tsx
+++ b/src/shared/components/text-button/TextButton.tsx
@@ -25,7 +25,11 @@ type Props = Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'> & {
 };
 
 export const TextButton = (props: Props) => {
-  const buttonClasses = classNames(styles.textButton, props.className);
+  const buttonClasses = classNames(
+    styles.textButton,
+    { [styles.disabled]: props.disabled },
+    props.className
+  );
 
   return (
     <button {...props} className={buttonClasses}>
diff --git a/src/shared/helpers/environment.test.ts b/src/shared/helpers/environment.test.ts
deleted file mode 100644
index 2c0697c117..0000000000
--- a/src/shared/helpers/environment.test.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-/**
- * See the NOTICE file distributed with this work for additional information
- * regarding copyright ownership.
- *
- * Licensed 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 { isEnvironment, Environment } from './environment';
-
-describe('isEnvironment', () => {
-  // Set the environment to development
-  process.env.ENVIRONMENT = 'development';
-
-  it('returns true if the envrionment matches', () => {
-    const isAvailableOnEnvironment = isEnvironment([Environment.DEVELOPMENT]);
-
-    expect(isAvailableOnEnvironment).toBe(true);
-  });
-
-  it('returns false if the envrionment does not match', () => {
-    const isAvailableOnEnvironment = isEnvironment([Environment.PRODUCTION]);
-
-    expect(isAvailableOnEnvironment).toBe(false);
-  });
-
-  it('supports multiple environments as input and returns true if at least one matches', () => {
-    const isAvailableOnEnvironment = isEnvironment([
-      Environment.DEVELOPMENT,
-      Environment.INTERNAL
-    ]);
-
-    expect(isAvailableOnEnvironment).toBe(true);
-  });
-});
diff --git a/src/shared/helpers/environment.ts b/src/shared/helpers/environment.ts
index 02c305b036..25b14a405f 100644
--- a/src/shared/helpers/environment.ts
+++ b/src/shared/helpers/environment.ts
@@ -16,11 +16,7 @@
 
 import { CONFIG_FIELD_ON_WINDOW } from 'src/shared/constants/globals';
 
-export enum Environment {
-  DEVELOPMENT = 'development',
-  INTERNAL = 'internal',
-  PRODUCTION = 'production'
-}
+type DeploymentEnvironment = 'development' | 'internal' | 'production';
 
 const defaultEnvironment = {
   buildEnvironment: 'production',
@@ -42,14 +38,14 @@ export const readEnvironment = (): typeof defaultEnvironment => {
   }
 };
 
-// Deployment environment
-export const isEnvironment = (environment: Environment[]): boolean => {
+// Deployment environment check
+export const isProductionEnvironment = () => {
   const currentEnvironment = getDeploymentEnvironment();
-  return environment.includes(currentEnvironment);
+  return currentEnvironment === 'production';
 };
 
 const getDeploymentEnvironment = () =>
-  readEnvironment().deploymentEnvironment as Environment;
+  readEnvironment().deploymentEnvironment as DeploymentEnvironment;
 
 export const isServer = (): boolean => {
   return typeof window === 'undefined';
diff --git a/static/icons/icon_launchbar_vep.svg b/static/icons/icon_launchbar_vep.svg
new file mode 100644
index 0000000000..9604237c2e
--- /dev/null
+++ b/static/icons/icon_launchbar_vep.svg
@@ -0,0 +1,70 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="vep" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 36 36" style="enable-background:new 0 0 36 36;" xml:space="preserve">
+<path d="M33,10.3149977v0.5543613h-3.0941124V7.1177483h0.5801468v3.1972494C30.4860344,10.3149977,33,10.3149977,33,10.3149977z"/>
+<path d="M27.4305954,7.1177483c0.4770088,0,0.8250961,0.0773525,1.0700474,0.2449503s0.360981,0.3996563,0.360981,0.7090673
+	c0,0.1675978-0.0515671,0.3223038-0.1418152,0.4512253c-0.1031361,0.1289206-0.2449493,0.2320585-0.4383316,0.309411
+	c0.1418152,0.0386763,0.2707367,0.103137,0.3867645,0.1804895c0.1160278,0.0773535,0.2191658,0.1804905,0.2836266,0.309411
+	c0.0773544,0.1289215,0.1160278,0.2836275,0.1160278,0.4512253c0,0.2191658-0.0386753,0.3996563-0.1289196,0.5414696
+	c-0.0902462,0.1418133-0.2062759,0.257843-0.3480873,0.3351955c-0.1418152,0.0773525-0.309412,0.1418133-0.4770088,0.1804895
+	c-0.1804905,0.0386763-0.3480873,0.051569-0.5285797,0.051569h-2.1916618V7.1177483H27.4305954z M27.4821663,7.6850019h-1.5212727
+	v0.9669099h1.5857334c0.1289215,0,0.2449493-0.0257835,0.3609791-0.0644598
+	c0.1160297-0.0386772,0.1933823-0.0902452,0.2707367-0.1675978c0.0644608-0.0773535,0.1031361-0.1675978,0.1031361-0.2707357
+	c0-0.1675973-0.0773525-0.2965188-0.2320576-0.3609796C27.8947144,7.7107863,27.7013321,7.6850019,27.4821663,7.6850019z
+	 M27.5724106,9.206274h-1.611517v1.1087236h1.6373005c0.257843,0,0.4641171-0.051568,0.6317139-0.1418133
+	c0.1675987-0.0902452,0.2449493-0.2320585,0.2449493-0.4254408c0-0.1418133-0.0515671-0.2578421-0.1418133-0.3351955
+	c-0.0902443-0.0773525-0.2062759-0.1289215-0.3480873-0.1675978C27.8431454,9.2320585,27.7142239,9.206274,27.5724106,9.206274z"/>
+<path d="M20.6622257,7.1177483l1.4825954,1.9982805l1.4825954-1.998281h0.5672531v3.764504h-0.5801468V9.2836266
+	c0-0.2320576,0-0.4512243,0.0128937-0.6574984c0.0128918-0.206274,0.0257835-0.412549,0.0515671-0.6317148l-1.3536739,1.8048992
+	h-0.3480873l-1.3665657-1.8048992c0.0257835,0.206274,0.0386772,0.4125481,0.051569,0.6317148
+	c0.0128918,0.206274,0.0128918,0.4254398,0.0128918,0.6574984v1.5986252h-0.5801468V7.1177483H20.6622257z"/>
+<path d="M15.9308119,7.1177483h3.1198969v0.5543618h-2.5397511v0.9926944h2.2432308v0.5543613h-2.2432308v1.0958319h2.5397511
+	v0.5543613h-3.1198969V7.1177483z"/>
+<path d="M11.8311129,9.7219591c0.206274,0.2191668,0.4383326,0.3867645,0.6703911,0.515686
+	c0.2320585,0.1160288,0.5156851,0.1804895,0.8508806,0.1804895c0.1804895,0,0.36098-0.0257845,0.5414696-0.0644608
+	c0.1675978-0.0386763,0.309411-0.1160288,0.4254408-0.206274c0.1160288-0.0902452,0.1675978-0.206274,0.1675978-0.3480883
+	c0-0.1160288-0.051569-0.2191658-0.1418133-0.2707348c-0.103137-0.0644608-0.2449503-0.1160288-0.4254408-0.1418133
+	c-0.1804905-0.0386763-0.4125481-0.0644608-0.6703911-0.103137c-0.3223028-0.0386763-0.6059294-0.103137-0.8379889-0.1933823
+	C12.1792002,9,11.9987116,8.8839703,11.8697901,8.742157s-0.1933823-0.3351955-0.1933823-0.5543623
+	c0-0.232058,0.0773525-0.4383321,0.2191658-0.6059299c0.1289215-0.1675978,0.3351955-0.2965193,0.5801458-0.386764
+	c0.257843-0.0902448,0.5285778-0.1289215,0.8508816-0.1289215c0.3867636,0,0.7090673,0.0515685,0.9926939,0.1675978
+	s0.5027933,0.283627,0.6574984,0.4899011l-0.3867645,0.4254403c-0.1418133-0.1675973-0.3223028-0.309411-0.5285769-0.4125481
+	c-0.2191658-0.103137-0.4641171-0.1547055-0.7477436-0.1547055c-0.1933813,0-0.36098,0.0257845-0.5156851,0.0644608
+	s-0.2707348,0.103137-0.36098,0.18049c-0.0902443,0.0773525-0.1289215,0.1675978-0.1289215,0.2836266
+	c0,0.1289215,0.051569,0.2320585,0.1418133,0.309412c0.0902443,0.0773525,0.2320585,0.1418133,0.3996563,0.1804895
+	s0.3738718,0.0773525,0.6059294,0.103137c0.2191658,0.0257845,0.4254408,0.051568,0.6188231,0.0902452
+	c0.206274,0.0386763,0.3867645,0.0902443,0.5414696,0.1675978c0.154705,0.0644608,0.2836266,0.1675978,0.3738718,0.2836266
+	c0.0902443,0.1160288,0.1418133,0.2707348,0.1418133,0.4641171c0,0.2449503-0.0773525,0.4512243-0.2191658,0.6446066
+	c-0.1418133,0.1804895-0.3480873,0.3223038-0.6188231,0.4254408c-0.2707348,0.103137-0.5801458,0.154705-0.9282331,0.154705
+	c-0.3867636,0-0.7348509-0.051568-1.0571547-0.1675978c-0.309411-0.1160288-0.5930376-0.2965183-0.8250971-0.5543613
+	L11.8311129,9.7219591z"/>
+<path d="M10.0648909,7.1177483h0.5801458v3.7645035h-0.5801458l-2.436614-2.9522991
+	c0.025784,0.2320585,0.0386763,0.4641171,0.0644603,0.6961756c0.0257845,0.2320585,0.0386763,0.4641171,0.0386763,0.6961746
+	v1.5599489H7.1512675V7.1177483h0.5672541l2.4366136,3.0296516c-0.0257845-0.1804895-0.0386763-0.36098-0.051568-0.5801458
+	c-0.0128927-0.206275-0.0257845-0.412549-0.0257845-0.6317148c0-0.206274-0.0128918-0.4125481-0.0128918-0.5930386V7.1177483z"/>
+<path d="M6.1070046,7.1177483v0.5543618H3.5672541v0.9926944h2.2432318v0.5543613H3.5672541l0.012892,0.5285778
+	c0,0.1804905,0.090245,0.3351955,0.2449508,0.4254408c0.1675978,0.0902452,0.373872,0.1418133,0.6317146,0.1418133h1.6501932
+	v0.5543613H4.4825954c-0.1804895,0-0.3480873-0.0128918-0.5285773-0.051568s-0.3351955-0.0902452-0.4770091-0.1804895
+	c-0.1418135-0.0773535-0.2578428-0.1933823-0.3480878-0.3351955C3.0386765,10.1602917,3,9.9798021,3,9.7606363V9.5930386V7.1177483
+	H6.1070046z"/>
+<g>
+	<path d="M4.1999998,15.7414036h1.5636816c0.1679058,0,0.3048568,0.0412722,0.4103842,0.12288
+		s0.1847901,0.1871347,0.2377882,0.3165827l2.449173,6.3541546c0.0816078,0.2063656,0.1599331,0.4333668,0.2345057,0.6800652
+		c0.0741034,0.2476387,0.1449242,0.5084076,0.2124615,0.7823105c0.110218-0.552494,0.2471685-1.040266,0.4103842-1.4623756
+		l2.4421377-6.3541546c0.043149-0.110218,0.1200676-0.2110548,0.2307539-0.3025122
+		c0.1102171-0.0909882,0.2471685-0.1369505,0.4103842-0.1369505h1.5632124L10.1578407,26.158596H8.4074936L4.1999998,15.7414036z"/>
+	<path d="M22.0224018,15.7414036v1.5416374h-4.6174088v2.8891048h3.6381149v1.490984h-3.6381149v2.9467945h4.6174088v1.5486717
+		h-6.5694313V15.7414036H22.0224018z"/>
+	<path d="M25.7031956,22.4918728v3.6667233h-1.9379501V15.7414036h3.3937588c0.6960125,0,1.29916,0.0820761,1.8075676,0.2452917
+		c0.509346,0.1632166,0.9295788,0.3911562,1.2607002,0.6842871c0.3320599,0.2931309,0.5768833,0.6434822,0.7354088,1.0515213
+		c0.1585255,0.4085083,0.2373199,0.8550072,0.2373199,1.3399639c0,0.5046539-0.0834846,0.9666309-0.2523289,1.3868637
+		c-0.1679058,0.4202328-0.4202328,0.7818413-0.7560444,1.0843525s-0.7560444,0.5379543-1.2607002,0.7058601
+		c-0.5046558,0.168375-1.0946712,0.2523289-1.7719231,0.2523289H25.7031956z M25.7031956,20.9788437h1.4558086
+		c0.3555107,0,0.6650581-0.0440865,0.9286423-0.1331978c0.2645206-0.088644,0.4830799-0.2162151,0.6556759-0.3817749
+		c0.1735344-0.1655617,0.3029804-0.3672352,0.3892784-0.6050243c0.086298-0.2377872,0.1294479-0.5032482,0.1294479-0.7963791
+		c0-0.2781239-0.0431499-0.5304508-0.1294479-0.7560463c-0.086298-0.2260628-0.215744-0.4178886-0.3892784-0.5764141
+		c-0.172596-0.1585255-0.3911552-0.2799988-0.6556759-0.3639507c-0.2635841-0.0839539-0.5731316-0.1261654-0.9286423-0.1261654
+		h-1.4558086V20.9788437z"/>
+</g>
+</svg>
diff --git a/static/img/tools/vep/ensembl-vep.svg b/static/img/tools/vep/ensembl-vep.svg
new file mode 100644
index 0000000000..bb9074d83d
--- /dev/null
+++ b/static/img/tools/vep/ensembl-vep.svg
@@ -0,0 +1,42 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="e_x5F_logotype" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+	 y="0px" viewBox="0 0 315 32" style="enable-background:new 0 0 315 32;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#9AA7B1;}
+	.st1{enable-background:new    ;}
+	.st2{fill:#1B2C39;}
+</style>
+<g>
+	<path class="st0" d="M234.1,26.2v4.3h-24V1.4h4.5v24.8C214.6,26.2,234.1,26.2,234.1,26.2z"/>
+	<path class="st0" d="M190.9,1.4c3.7,0,6.4,0.6,8.3,1.9c1.9,1.3,2.8,3.1,2.8,5.5c0,1.3-0.4,2.5-1.1,3.5c-0.8,1-1.9,1.8-3.4,2.4
+		c1.1,0.3,2.1,0.8,3,1.4c0.9,0.6,1.7,1.4,2.2,2.4c0.6,1,0.9,2.2,0.9,3.5c0,1.7-0.3,3.1-1,4.2s-1.6,2-2.7,2.6
+		c-1.1,0.6-2.4,1.1-3.7,1.4c-1.4,0.3-2.7,0.4-4.1,0.4h-17V1.4H190.9z M191.3,5.8h-11.8v7.5h12.3c1,0,1.9-0.2,2.8-0.5
+		c0.9-0.3,1.5-0.7,2.1-1.3c0.5-0.6,0.8-1.3,0.8-2.1c0-1.3-0.6-2.3-1.8-2.8C194.5,6,193,5.8,191.3,5.8z M192,17.6h-12.5v8.6h12.7
+		c2,0,3.6-0.4,4.9-1.1c1.3-0.7,1.9-1.8,1.9-3.3c0-1.1-0.4-2-1.1-2.6c-0.7-0.6-1.6-1-2.7-1.3C194.1,17.8,193.1,17.6,192,17.6z"/>
+	<path class="st0" d="M138.4,1.4l11.5,15.5l11.5-15.5h4.4v29.2h-4.5V18.2c0-1.8,0-3.5,0.1-5.1s0.2-3.2,0.4-4.9l-10.5,14h-2.7
+		L138,8.2c0.2,1.6,0.3,3.2,0.4,4.9c0.1,1.6,0.1,3.3,0.1,5.1v12.4H134V1.4H138.4z"/>
+	<path class="st0" d="M101.7,1.4h24.2v4.3h-19.7v7.7h17.4v4.3h-17.4v8.5h19.7v4.3h-24.2V1.4z"/>
+	<path class="st0" d="M69.9,21.6c1.6,1.7,3.4,3,5.2,4c1.8,0.9,4,1.4,6.6,1.4c1.4,0,2.8-0.2,4.2-0.5c1.3-0.3,2.4-0.9,3.3-1.6
+		s1.3-1.6,1.3-2.7c0-0.9-0.4-1.7-1.1-2.1c-0.8-0.5-1.9-0.9-3.3-1.1c-1.4-0.3-3.2-0.5-5.2-0.8c-2.5-0.3-4.7-0.8-6.5-1.5
+		c-1.8-0.7-3.2-1.6-4.2-2.7s-1.5-2.6-1.5-4.3c0-1.8,0.6-3.4,1.7-4.7c1-1.3,2.6-2.3,4.5-3c2-0.7,4.1-1,6.6-1c3,0,5.5,0.4,7.7,1.3
+		s3.9,2.2,5.1,3.8l-3,3.3c-1.1-1.3-2.5-2.4-4.1-3.2C85.5,5.4,83.6,5,81.4,5c-1.5,0-2.8,0.2-4,0.5s-2.1,0.8-2.8,1.4
+		c-0.7,0.6-1,1.3-1,2.2c0,1,0.4,1.8,1.1,2.4c0.7,0.6,1.8,1.1,3.1,1.4c1.3,0.3,2.9,0.6,4.7,0.8c1.7,0.2,3.3,0.4,4.8,0.7
+		c1.6,0.3,3,0.7,4.2,1.3c1.2,0.5,2.2,1.3,2.9,2.2c0.7,0.9,1.1,2.1,1.1,3.6c0,1.9-0.6,3.5-1.7,5c-1.1,1.4-2.7,2.5-4.8,3.3
+		c-2.1,0.8-4.5,1.2-7.2,1.2c-3,0-5.7-0.4-8.2-1.3c-2.4-0.9-4.6-2.3-6.4-4.3L69.9,21.6z"/>
+	<path class="st0" d="M56.2,1.4h4.5v29.2h-4.5L37.3,7.7c0.2,1.8,0.3,3.6,0.5,5.4s0.3,3.6,0.3,5.4v12.1h-4.5V1.4H38l18.9,23.5
+		c-0.2-1.4-0.3-2.8-0.4-4.5c-0.1-1.6-0.2-3.2-0.2-4.9c0-1.6-0.1-3.2-0.1-4.6V1.4z"/>
+	<path class="st0" d="M25.5,1.4v4.3H5.8v7.7h17.4v4.3H5.8l0.1,4.1c0,1.4,0.7,2.6,1.9,3.3c1.3,0.7,2.9,1.1,4.9,1.1h12.8v4.3H12.9
+		c-1.4,0-2.7-0.1-4.1-0.4s-2.6-0.7-3.7-1.4c-1.1-0.6-2-1.5-2.7-2.6s-1-2.5-1-4.2v-1.3V1.4H25.5z"/>
+</g>
+<g class="st1">
+	<path class="st2" d="M237.8,1.4l4.4,0c0.5,0,0.9,0.1,1.1,0.3c0.3,0.2,0.5,0.5,0.7,0.9l6.8,17.7c0.2,0.6,0.4,1.2,0.7,1.9
+		c0.2,0.7,0.4,1.4,0.6,2.2c0.3-1.5,0.7-2.9,1.1-4.1L260,2.6c0.1-0.3,0.3-0.6,0.6-0.8c0.3-0.3,0.7-0.4,1.1-0.4l4.4,0l-11.8,29.1
+		l-4.9,0L237.8,1.4z"/>
+	<path class="st2" d="M287.6,1.4v4.3l-12.9,0v8.1l10.2,0v4.2l-10.2,0l0,8.2l12.9,0v4.3l-18.4,0l0-29.1L287.6,1.4z"/>
+	<path class="st2" d="M297.9,20.3v10.2l-5.4,0l0-29.1l9.5,0c1.9,0,3.6,0.2,5.1,0.7c1.4,0.5,2.6,1.1,3.5,1.9c0.9,0.8,1.6,1.8,2.1,2.9
+		c0.4,1.1,0.7,2.4,0.7,3.7c0,1.4-0.2,2.7-0.7,3.9s-1.2,2.2-2.1,3c-0.9,0.8-2.1,1.5-3.5,2c-1.4,0.5-3.1,0.7-5,0.7L297.9,20.3z
+		 M297.9,16l4.1,0c1,0,1.9-0.1,2.6-0.4c0.7-0.2,1.3-0.6,1.8-1.1c0.5-0.5,0.8-1,1.1-1.7c0.2-0.7,0.4-1.4,0.4-2.2
+		c0-0.8-0.1-1.5-0.4-2.1s-0.6-1.2-1.1-1.6c-0.5-0.4-1.1-0.8-1.8-1c-0.7-0.2-1.6-0.4-2.6-0.4l-4.1,0V16z"/>
+</g>
+</svg>
diff --git a/stories/shared-components/app-icon/AppIcon.stories.tsx b/stories/shared-components/app-icon/AppIcon.stories.tsx
index e12024d362..906d50ba9a 100644
--- a/stories/shared-components/app-icon/AppIcon.stories.tsx
+++ b/stories/shared-components/app-icon/AppIcon.stories.tsx
@@ -20,6 +20,7 @@ import {
   GlobalSearchIcon,
   EntityViewerIcon,
   BlastIcon,
+  VepIcon,
   HelpIcon
 } from 'src/shared/components/app-icon';
 
@@ -47,6 +48,10 @@ export const AppIconStory = () => (
       <BlastIcon />
       <div>Blast</div>
     </div>
+    <div className={styles.appIconWrapper}>
+      <VepIcon />
+      <div>VEP</div>
+    </div>
     <div className={styles.appIconWrapper}>
       <HelpIcon />
       <div>Help</div>