diff --git a/docs/docs/concepts.mdx b/docs/docs/concepts.mdx
index 0e3051fcc3b..7209a4edcf3 100644
--- a/docs/docs/concepts.mdx
+++ b/docs/docs/concepts.mdx
@@ -1,6 +1,7 @@
 # Conceptual guide
 
 import ThemedImage from '@theme/ThemedImage';
+import useBaseUrl from '@docusaurus/useBaseUrl';
 
 This section contains introductions to key parts of LangChain.
 
@@ -11,8 +12,8 @@ LangChain as a framework consists of several pieces. The below diagram shows how
 <ThemedImage
   alt="Diagram outlining the hierarchical organization of the LangChain framework, displaying the interconnected parts across multiple layers."
   sources={{
-    light: '/svg/langchain_stack.svg',
-    dark: '/svg/langchain_stack_dark.svg',
+    light: useBaseUrl('/svg/langchain_stack.svg'),
+    dark: useBaseUrl('/svg/langchain_stack_dark.svg'),
   }}
   title="LangChain Framework Overview"
 />
diff --git a/docs/docs/introduction.mdx b/docs/docs/introduction.mdx
index aa764bf5359..4c4be557d93 100644
--- a/docs/docs/introduction.mdx
+++ b/docs/docs/introduction.mdx
@@ -13,12 +13,13 @@ LangChain simplifies every stage of the LLM application lifecycle:
 - **Deployment**: Turn any chain into an API with [LangServe](/docs/langserve).
 
 import ThemedImage from '@theme/ThemedImage';
+import useBaseUrl from '@docusaurus/useBaseUrl';
 
 <ThemedImage
   alt="Diagram outlining the hierarchical organization of the LangChain framework, displaying the interconnected parts across multiple layers."
   sources={{
-    light: '/svg/langchain_stack.svg',
-    dark: '/svg/langchain_stack_dark.svg',
+    light: useBaseUrl('/svg/langchain_stack.svg'),
+    dark: useBaseUrl('/svg/langchain_stack_dark.svg'),
   }}
   title="LangChain Framework Overview"
 />