diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md
index a152e04f..427030f6 100644
--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@@ -860,11 +860,12 @@ None.
 
 ### Slots
 
-| Slot name    | Default | Props | Fallback                    |
-| :----------- | :------ | :---- | :-------------------------- |
-| --           | Yes     | --    | --                          |
-| labelText    | No      | --    | <code>{labelText}</code>    |
-| shortcutText | No      | --    | <code>{shortcutText}</code> |
+| Slot name    | Default | Props | Fallback                                              |
+| :----------- | :------ | :---- | :---------------------------------------------------- |
+| --           | Yes     | --    | --                                                    |
+| icon         | No      | --    | <code>&lt;svelte:component this="{icon}" /&gt;</code> |
+| labelText    | No      | --    | <code>{labelText}</code>                              |
+| shortcutText | No      | --    | <code>{shortcutText}</code>                           |
 
 ### Events
 
@@ -1631,6 +1632,8 @@ None.
 | Slot name | Default | Props | Fallback                                                    |
 | :-------- | :------ | :---- | :---------------------------------------------------------- |
 | --        | Yes     | --    | --                                                          |
+| closeIcon | No      | --    | <code>&lt;svelte:component this="{closeIcon}" /&gt;</code>  |
+| icon      | No      | --    | <code>&lt;svelte:component this="{icon}" /&gt;</code>       |
 | text      | No      | --    | <code>{#if text}&lt;span&gt;{text}&lt;/span&gt;{/if}</code> |
 
 ### Events
@@ -1653,7 +1656,9 @@ None.
 
 ### Slots
 
-None.
+| Slot name | Default | Props | Fallback                                              |
+| :-------- | :------ | :---- | :---------------------------------------------------- |
+| icon      | No      | --    | <code>&lt;svelte:component this="{icon}" /&gt;</code> |
 
 ### Events
 
@@ -2035,9 +2040,10 @@ None.
 
 ### Slots
 
-| Slot name | Default | Props | Fallback |
-| :-------- | :------ | :---- | :------- |
-| --        | Yes     | --    | --       |
+| Slot name | Default | Props | Fallback                                              |
+| :-------- | :------ | :---- | :---------------------------------------------------- |
+| --        | Yes     | --    | --                                                    |
+| icon      | No      | --    | <code>&lt;svelte:component this="{icon}" /&gt;</code> |
 
 ### Events
 
@@ -3436,7 +3442,9 @@ None.
 
 ### Slots
 
-None.
+| Slot name | Default | Props | Fallback                                              |
+| :-------- | :------ | :---- | :---------------------------------------------------- |
+| icon      | No      | --    | <code>&lt;svelte:component this="{icon}" /&gt;</code> |
 
 ### Events
 
@@ -3457,9 +3465,10 @@ None.
 
 ### Slots
 
-| Slot name | Default | Props | Fallback |
-| :-------- | :------ | :---- | :------- |
-| --        | Yes     | --    | --       |
+| Slot name | Default | Props | Fallback                                              |
+| :-------- | :------ | :---- | :---------------------------------------------------- |
+| --        | Yes     | --    | --                                                    |
+| icon      | No      | --    | <code>&lt;svelte:component this="{icon}" /&gt;</code> |
 
 ### Events
 
@@ -4068,9 +4077,10 @@ None.
 
 ### Slots
 
-| Slot name | Default | Props                                                  | Fallback |
-| :-------- | :------ | :----------------------------------------------------- | :------- |
-| --        | Yes     | <code>{ props: { class: 'bx--tag\_\_label' } } </code> | --       |
+| Slot name | Default | Props                                                  | Fallback                                              |
+| :-------- | :------ | :----------------------------------------------------- | :---------------------------------------------------- |
+| --        | Yes     | <code>{ props: { class: 'bx--tag\_\_label' } } </code> | --                                                    |
+| icon      | No      | --                                                     | <code>&lt;svelte:component this="{icon}" /&gt;</code> |
 
 ### Events
 
diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json
index 5505675e..eb5eda97 100644
--- a/docs/src/COMPONENT_API.json
+++ b/docs/src/COMPONENT_API.json
@@ -2075,6 +2075,12 @@
       "moduleExports": [],
       "slots": [
         { "name": "__default__", "default": true, "slot_props": "{}" },
+        {
+          "name": "icon",
+          "default": false,
+          "fallback": "<svelte:component this=\"{icon}\" />",
+          "slot_props": "{}"
+        },
         {
           "name": "labelText",
           "default": false,
@@ -4621,6 +4627,18 @@
       "moduleExports": [],
       "slots": [
         { "name": "__default__", "default": true, "slot_props": "{}" },
+        {
+          "name": "closeIcon",
+          "default": false,
+          "fallback": "<svelte:component this=\"{closeIcon}\" />",
+          "slot_props": "{}"
+        },
+        {
+          "name": "icon",
+          "default": false,
+          "fallback": "<svelte:component this=\"{icon}\" />",
+          "slot_props": "{}"
+        },
         {
           "name": "text",
           "default": false,
@@ -4683,7 +4701,14 @@
         }
       ],
       "moduleExports": [],
-      "slots": [],
+      "slots": [
+        {
+          "name": "icon",
+          "default": false,
+          "fallback": "<svelte:component this=\"{icon}\" />",
+          "slot_props": "{}"
+        }
+      ],
       "events": [],
       "typedefs": [],
       "rest_props": { "type": "Element", "name": "a" }
@@ -5507,7 +5532,15 @@
         }
       ],
       "moduleExports": [],
-      "slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }],
+      "slots": [
+        { "name": "__default__", "default": true, "slot_props": "{}" },
+        {
+          "name": "icon",
+          "default": false,
+          "fallback": "<svelte:component this=\"{icon}\" />",
+          "slot_props": "{}"
+        }
+      ],
       "events": [
         { "type": "forwarded", "name": "click", "element": "p" },
         { "type": "forwarded", "name": "mouseover", "element": "p" },
@@ -10117,7 +10150,14 @@
         }
       ],
       "moduleExports": [],
-      "slots": [],
+      "slots": [
+        {
+          "name": "icon",
+          "default": false,
+          "fallback": "<svelte:component this=\"{icon}\" />",
+          "slot_props": "{}"
+        }
+      ],
       "events": [{ "type": "forwarded", "name": "click", "element": "a" }],
       "typedefs": [],
       "rest_props": { "type": "Element", "name": "a" }
@@ -10170,7 +10210,15 @@
         }
       ],
       "moduleExports": [],
-      "slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }],
+      "slots": [
+        { "name": "__default__", "default": true, "slot_props": "{}" },
+        {
+          "name": "icon",
+          "default": false,
+          "fallback": "<svelte:component this=\"{icon}\" />",
+          "slot_props": "{}"
+        }
+      ],
       "events": [{ "type": "forwarded", "name": "click", "element": "button" }],
       "typedefs": [],
       "rest_props": { "type": "Element", "name": "button" }
@@ -11546,6 +11594,12 @@
           "name": "__default__",
           "default": true,
           "slot_props": "{ props: { class: 'bx--tag__label' } }"
+        },
+        {
+          "name": "icon",
+          "default": false,
+          "fallback": "<svelte:component this=\"{icon}\" />",
+          "slot_props": "{}"
         }
       ],
       "events": [
diff --git a/src/ContextMenu/ContextMenuOption.svelte b/src/ContextMenu/ContextMenuOption.svelte
index 6cd3e833..d67caa80 100644
--- a/src/ContextMenu/ContextMenuOption.svelte
+++ b/src/ContextMenu/ContextMenuOption.svelte
@@ -245,7 +245,9 @@
     >
       {#if indented}
         <div class:bx--menu-option__icon="{true}">
-          <svelte:component this="{icon}" />
+          <slot name="icon">
+            <svelte:component this="{icon}" />
+          </slot>
         </div>
       {/if}
       <span class:bx--menu-option__label="{true}" title="{labelText}">
@@ -268,7 +270,9 @@
     >
       {#if indented}
         <div class:bx--menu-option__icon="{true}">
-          <svelte:component this="{icon}" />
+          <slot name="icon">
+            <svelte:component this="{icon}" />
+          </slot>
         </div>
       {/if}
       <span class:bx--menu-option__label="{true}" title="{labelText}">
diff --git a/src/Link/Link.svelte b/src/Link/Link.svelte
index 0da97518..65732cc4 100644
--- a/src/Link/Link.svelte
+++ b/src/Link/Link.svelte
@@ -45,9 +45,14 @@
     on:mouseenter
     on:mouseleave
   >
-    <slot />{#if !inline && icon}<div class:bx--link__icon="{true}">
-        <svelte:component this="{icon}" />
-      </div>{/if}
+    <slot />
+    {#if !inline && ($$slots.icon || icon)}
+      <div class:bx--link__icon="{true}">
+        <slot name="icon">
+          <svelte:component this="{icon}" />
+        </slot>
+      </div>
+    {/if}
   </p>
 {:else}
   <a
@@ -65,8 +70,14 @@
     on:mouseover
     on:mouseenter
     on:mouseleave
-    ><slot />{#if !inline && icon}<div class:bx--link__icon="{true}">
-        <svelte:component this="{icon}" />
-      </div>{/if}</a
   >
+    <slot />
+    {#if !inline && ($$slots.icon || icon)}
+      <div class:bx--link__icon="{true}">
+        <slot name="icon">
+          <svelte:component this="{icon}" />
+        </slot>
+      </div>
+    {/if}
+  </a>
 {/if}
diff --git a/src/Tag/Tag.svelte b/src/Tag/Tag.svelte
index a7174d95..3862b1a6 100644
--- a/src/Tag/Tag.svelte
+++ b/src/Tag/Tag.svelte
@@ -120,9 +120,11 @@
     on:mouseenter
     on:mouseleave
   >
-    {#if icon}
+    {#if $$slots.icon || icon}
       <div class:bx--tag__custom-icon="{true}">
-        <svelte:component this="{icon}" />
+        <slot name="icon">
+          <svelte:component this="{icon}" />
+        </slot>
       </div>
     {/if}
     <span>
@@ -153,9 +155,11 @@
     on:mouseenter
     on:mouseleave
   >
-    {#if icon}
+    {#if $$slots.icon || icon}
       <div class:bx--tag__custom-icon="{true}">
-        <svelte:component this="{icon}" />
+        <slot name="icon">
+          <svelte:component this="{icon}" />
+        </slot>
       </div>
     {/if}
     <span>
diff --git a/src/UIShell/GlobalHeader/HeaderAction.svelte b/src/UIShell/GlobalHeader/HeaderAction.svelte
index 34197d1a..fdf8958e 100644
--- a/src/UIShell/GlobalHeader/HeaderAction.svelte
+++ b/src/UIShell/GlobalHeader/HeaderAction.svelte
@@ -64,9 +64,13 @@
   }}"
 >
   {#if isOpen}
-    <svelte:component this="{closeIcon}" />
+    <slot name="closeIcon">
+      <svelte:component this="{closeIcon}" />
+    </slot>
   {:else}
-    <svelte:component this="{icon}" />
+    <slot name="icon">
+      <svelte:component this="{icon}" />
+    </slot>
   {/if}
   <slot name="text">
     {#if text}<span>{text}</span>{/if}
diff --git a/src/UIShell/GlobalHeader/HeaderActionLink.svelte b/src/UIShell/GlobalHeader/HeaderActionLink.svelte
index 508594e2..3283b398 100644
--- a/src/UIShell/GlobalHeader/HeaderActionLink.svelte
+++ b/src/UIShell/GlobalHeader/HeaderActionLink.svelte
@@ -26,7 +26,9 @@
   rel="{$$restProps.target === '_blank' ? 'noopener noreferrer' : undefined}"
   {...$$restProps}
 >
-  <svelte:component this="{icon}" />
+  <slot name="icon">
+    <svelte:component this="{icon}" />
+  </slot>
 </a>
 
 <style>
diff --git a/src/UIShell/SideNav/SideNavLink.svelte b/src/UIShell/SideNav/SideNavLink.svelte
index 8053cd49..1132ad00 100644
--- a/src/UIShell/SideNav/SideNavLink.svelte
+++ b/src/UIShell/SideNav/SideNavLink.svelte
@@ -35,12 +35,14 @@
     {...$$restProps}
     on:click
   >
-    {#if icon}
+    {#if $$slots.icon || icon}
       <div
         class:bx--side-nav__icon="{true}"
         class:bx--side-nav__icon--small="{true}"
       >
-        <svelte:component this="{icon}" />
+        <slot name="icon">
+          <svelte:component this="{icon}" />
+        </slot>
       </div>
     {/if}
     <span class:bx--side-nav__link-text="{true}">{text}</span>
diff --git a/src/UIShell/SideNav/SideNavMenu.svelte b/src/UIShell/SideNav/SideNavMenu.svelte
index f261cf96..56ee55cb 100644
--- a/src/UIShell/SideNav/SideNavMenu.svelte
+++ b/src/UIShell/SideNav/SideNavMenu.svelte
@@ -32,9 +32,11 @@
       expanded = !expanded;
     }}"
   >
-    {#if icon}
+    {#if $$slots.icon || icon}
       <div class:bx--side-nav__icon="{true}">
-        <svelte:component this="{icon}" />
+        <slot name="icon">
+          <svelte:component this="{icon}" />
+        </slot>
       </div>
     {/if}
     <span class:bx--side-nav__submenu-title="{true}">{text}</span>
diff --git a/types/ContextMenu/ContextMenuOption.svelte.d.ts b/types/ContextMenu/ContextMenuOption.svelte.d.ts
index a8e53ec4..45267811 100644
--- a/types/ContextMenu/ContextMenuOption.svelte.d.ts
+++ b/types/ContextMenu/ContextMenuOption.svelte.d.ts
@@ -77,5 +77,5 @@ export default class ContextMenuOption extends SvelteComponentTyped<
     mouseleave: WindowEventMap["mouseleave"];
     click: CustomEvent<any>;
   },
-  { default: {}; labelText: {}; shortcutText: {} }
+  { default: {}; icon: {}; labelText: {}; shortcutText: {} }
 > {}
diff --git a/types/Link/Link.svelte.d.ts b/types/Link/Link.svelte.d.ts
index 09e59acb..c933c46c 100644
--- a/types/Link/Link.svelte.d.ts
+++ b/types/Link/Link.svelte.d.ts
@@ -55,5 +55,5 @@ export default class Link extends SvelteComponentTyped<
     mouseenter: WindowEventMap["mouseenter"];
     mouseleave: WindowEventMap["mouseleave"];
   },
-  { default: {} }
+  { default: {}; icon: {} }
 > {}
diff --git a/types/Tag/Tag.svelte.d.ts b/types/Tag/Tag.svelte.d.ts
index 75dffdd7..08337d25 100644
--- a/types/Tag/Tag.svelte.d.ts
+++ b/types/Tag/Tag.svelte.d.ts
@@ -79,5 +79,5 @@ export default class Tag extends SvelteComponentTyped<
     mouseleave: WindowEventMap["mouseleave"];
     close: CustomEvent<any>;
   },
-  { default: { props: { class: "bx--tag__label" } } }
+  { default: { props: { class: "bx--tag__label" } }; icon: {} }
 > {}
diff --git a/types/UIShell/GlobalHeader/HeaderAction.svelte.d.ts b/types/UIShell/GlobalHeader/HeaderAction.svelte.d.ts
index 265d8463..5365e236 100644
--- a/types/UIShell/GlobalHeader/HeaderAction.svelte.d.ts
+++ b/types/UIShell/GlobalHeader/HeaderAction.svelte.d.ts
@@ -45,5 +45,5 @@ export interface HeaderActionProps
 export default class HeaderAction extends SvelteComponentTyped<
   HeaderActionProps,
   { click: WindowEventMap["click"]; close: CustomEvent<any> },
-  { default: {}; text: {} }
+  { default: {}; closeIcon: {}; icon: {}; text: {} }
 > {}
diff --git a/types/UIShell/GlobalHeader/HeaderActionLink.svelte.d.ts b/types/UIShell/GlobalHeader/HeaderActionLink.svelte.d.ts
index bd2f03aa..692fa04f 100644
--- a/types/UIShell/GlobalHeader/HeaderActionLink.svelte.d.ts
+++ b/types/UIShell/GlobalHeader/HeaderActionLink.svelte.d.ts
@@ -31,5 +31,5 @@ export interface HeaderActionLinkProps
 export default class HeaderActionLink extends SvelteComponentTyped<
   HeaderActionLinkProps,
   {},
-  {}
+  { icon: {} }
 > {}
diff --git a/types/UIShell/SideNav/SideNavLink.svelte.d.ts b/types/UIShell/SideNav/SideNavLink.svelte.d.ts
index 33d3795e..6da00387 100644
--- a/types/UIShell/SideNav/SideNavLink.svelte.d.ts
+++ b/types/UIShell/SideNav/SideNavLink.svelte.d.ts
@@ -37,5 +37,5 @@ export interface SideNavLinkProps
 export default class SideNavLink extends SvelteComponentTyped<
   SideNavLinkProps,
   { click: WindowEventMap["click"] },
-  {}
+  { icon: {} }
 > {}
diff --git a/types/UIShell/SideNav/SideNavMenu.svelte.d.ts b/types/UIShell/SideNav/SideNavMenu.svelte.d.ts
index 60e834f2..5e3aa0c0 100644
--- a/types/UIShell/SideNav/SideNavMenu.svelte.d.ts
+++ b/types/UIShell/SideNav/SideNavMenu.svelte.d.ts
@@ -31,5 +31,5 @@ export interface SideNavMenuProps
 export default class SideNavMenu extends SvelteComponentTyped<
   SideNavMenuProps,
   { click: WindowEventMap["click"] },
-  { default: {} }
+  { default: {}; icon: {} }
 > {}