diff --git a/packages/website/docusaurus.config.ts b/packages/website/docusaurus.config.ts
index 136b0810da4..e6a11f7810c 100644
--- a/packages/website/docusaurus.config.ts
+++ b/packages/website/docusaurus.config.ts
@@ -18,10 +18,11 @@ const SSPL_LICENSE_URL =
 
 const baseUrl = process.env.DOCS_BASE_URL || '/';
 const googleTagManagerId = process.env.DOCS_GOOGLE_TAG_MANAGER_ID || undefined;
+const isDevelopment = process.env.NODE_ENV === 'development';
 
 let storybookBaseUrl: string = 'https://eui.elastic.co/storybook';
 
-if (process.env.NODE_ENV === 'development') {
+if (isDevelopment) {
   storybookBaseUrl = 'http://localhost:6006';
 } else if (process.env.STORYBOOK_BASE_URL) {
   storybookBaseUrl = process.env.STORYBOOK_BASE_URL;
@@ -30,7 +31,7 @@ if (process.env.NODE_ENV === 'development') {
 const config: Config = {
   title: 'Elastic UI Framework',
   tagline: 'The framework powering the Elastic Stack',
-  favicon: 'favicon.ico',
+  favicon: isDevelopment ? 'favicon-dev.svg' : 'favicon.ico',
   trailingSlash: true,
 
   // Set the production url of your site here
diff --git a/packages/website/static/favicon-dev.svg b/packages/website/static/favicon-dev.svg
new file mode 100644
index 00000000000..dcc826ba382
--- /dev/null
+++ b/packages/website/static/favicon-dev.svg
@@ -0,0 +1,16 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="32"
+  height="32"
+  fill="none"
+  viewBox="0 0 32 32"
+>
+  <path
+    fill="#69707D"
+    d="M18 25c-.5-5.5-5.5-10.5-11-11l7-7c.5 5.5 5.5 10.5 11 11l-7 7z"
+  />
+  <circle cx="7" cy="7" r="7" fill="#69707D" />
+  <circle cx="25" cy="25" r="7" fill="#69707D" />
+  <path fill="#69707D" d="M31 14c-7.18 0-13-5.82-13-13h13v13z" />
+  <path fill="#69707D" d="M1 18c7.18 0 13 5.82 13 13H1V18z" />
+</svg>