diff --git a/components/__design__/horizontal-logos.stories.tsx b/components/__design__/horizontal-logos.stories.tsx
new file mode 100644
index 0000000000000..adcf0362c2030
--- /dev/null
+++ b/components/__design__/horizontal-logos.stories.tsx
@@ -0,0 +1,27 @@
+import Image from 'next/image';
+import type { Meta as MetaObj, StoryObj } from '@storybook/react';
+
+export const HorizontalLogos: StoryObj = {};
+
+export default {
+ title: 'Design System/Logos',
+ component: () => {
+ return (
+
+
+
+
+ );
+ },
+} as MetaObj;
diff --git a/public/static/images/logos/horizontal-dark.svg b/public/static/images/logos/horizontal-dark.svg
new file mode 100644
index 0000000000000..08d1d85b4bc62
--- /dev/null
+++ b/public/static/images/logos/horizontal-dark.svg
@@ -0,0 +1,38 @@
+
diff --git a/public/static/images/logos/horizontal-light.svg b/public/static/images/logos/horizontal-light.svg
new file mode 100644
index 0000000000000..bd735e842ff00
--- /dev/null
+++ b/public/static/images/logos/horizontal-light.svg
@@ -0,0 +1,38 @@
+