diff --git a/packages/components/src/components/code-group/language-icon.tsx b/packages/components/src/components/code-group/language-icon.tsx
index 8d4b6b9..ad303bd 100644
--- a/packages/components/src/components/code-group/language-icon.tsx
+++ b/packages/components/src/components/code-group/language-icon.tsx
@@ -1,4 +1,6 @@
 import { cn } from "cn";
+import { useContext } from "react";
+import { IconUrlContext } from "@/components/icon/icon-url-context";
 import { getLanguageIconUrl } from "@/utils/icon-utils";
 
 type LanguageIconProps = {
@@ -7,12 +9,15 @@ type LanguageIconProps = {
 };
 
 const LanguageIcon = ({ language, className }: LanguageIconProps) => {
-  const url = getLanguageIconUrl(language);
+  const resolveUrl = useContext(IconUrlContext);
+  const languageIconUrl = getLanguageIconUrl(language);
 
-  if (!url) {
+  if (!languageIconUrl) {
     return null;
   }
 
+  const url = resolveUrl(languageIconUrl);
+
   return (
     <svg
       className={cn("size-3.5 shrink-0", className)}
diff --git a/packages/components/src/components/icon/icon-url-context.ts b/packages/components/src/components/icon/icon-url-context.ts
new file mode 100644
index 0000000..d10a747
--- /dev/null
+++ b/packages/components/src/components/icon/icon-url-context.ts
@@ -0,0 +1,8 @@
+import { createContext } from "react";
+
+type IconUrlResolver = (url: string) => string;
+
+const IconUrlContext = createContext<IconUrlResolver>((url) => url);
+
+export { IconUrlContext };
+export type { IconUrlResolver };
diff --git a/packages/components/src/components/icon/icon.tsx b/packages/components/src/components/icon/icon.tsx
index 2ed281b..9f88154 100644
--- a/packages/components/src/components/icon/icon.tsx
+++ b/packages/components/src/components/icon/icon.tsx
@@ -1,7 +1,7 @@
 /** biome-ignore-all lint/complexity/noExcessiveCognitiveComplexity: TODO */
 
 import { cn } from "cn";
-import type { CSSProperties } from "react";
+import { type CSSProperties, useContext } from "react";
 import { MINTLIFY_ICONS_CDN_URL } from "@/constants";
 import { Classes } from "@/constants/selectors";
 import {
@@ -13,6 +13,7 @@ import {
   type PageType,
 } from "@/utils/icon-utils";
 import { isAbsoluteUrl } from "@/utils/is-absolute-url";
+import { IconUrlContext } from "./icon-url-context";
 
 type IconProps = {
   icon: string;
@@ -43,6 +44,7 @@ const Icon = ({
   overrideColor,
   overrideSize,
 }: IconProps) => {
+  const resolveUrl = useContext(IconUrlContext);
   const style: CSSProperties = {
     ...(!overrideSize && { width: size || 16, height: size || 16 }),
     display: "inline-block",
@@ -67,7 +69,7 @@ const Icon = ({
     className
   );
   const isPdf = pageType === "pdf";
-  const url = getIconUrl(icon.toLowerCase(), iconType, iconLibrary);
+  const url = resolveUrl(getIconUrl(icon.toLowerCase(), iconType, iconLibrary));
 
   if (iconType && !ICON_TYPES.includes(iconType)) {
     console.log(
@@ -84,15 +86,16 @@ const Icon = ({
       icon.startsWith(MINTLIFY_ICONS_CDN_URL) ||
       icon.startsWith("https://mintlify.b-cdn.net")
     ) {
+      const iconUrl = resolveUrl(icon);
       return (
         <svg
           className={classNames}
           data-component-part="icon-svg"
           style={{
-            WebkitMaskImage: `url(${icon})`,
+            WebkitMaskImage: `url(${iconUrl})`,
             WebkitMaskRepeat: "no-repeat",
             WebkitMaskPosition: "center",
-            maskImage: `url(${icon})`,
+            maskImage: `url(${iconUrl})`,
             maskRepeat: "no-repeat",
             maskPosition: "center",
             maskSize: "100%",
diff --git a/packages/components/src/components/icon/index.ts b/packages/components/src/components/icon/index.ts
index 62ef309..dc78e3e 100644
--- a/packages/components/src/components/icon/index.ts
+++ b/packages/components/src/components/icon/index.ts
@@ -1,2 +1,4 @@
 export type { IconProps } from "./icon";
 export { Icon } from "./icon";
+export type { IconUrlResolver } from "./icon-url-context";
+export { IconUrlContext } from "./icon-url-context";