diff --git a/pages/theming/themed-stroke-width.page.tsx b/pages/theming/themed-stroke-width.page.tsx
new file mode 100644
index 0000000000..8b67e88eb4
--- /dev/null
+++ b/pages/theming/themed-stroke-width.page.tsx
@@ -0,0 +1,335 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React, { useLayoutEffect, useState } from 'react';
+
+import {
+  Alert,
+  Box,
+  Button,
+  Flashbar,
+  FormField,
+  IconProvider,
+  Input,
+  KeyValuePairs,
+  Link,
+  Select,
+  SelectProps,
+  SpaceBetween,
+  StatusIndicator,
+} from '~components';
+import Icon, { IconProps } from '~components/icon';
+import icons from '~components/icon/generated/icons';
+import { applyTheme, Theme } from '~components/theming';
+
+import ScreenshotArea from '../utils/screenshot-area';
+
+import styles from '../icon/icons-list.scss';
+
+export default function () {
+  const [themed, setThemed] = useState<boolean>(false);
+  const [strokeSmall, setStrokeSmall] = useState<string>('2');
+  const [strokeNormal, setStrokeNormal] = useState<string>('2');
+  const [strokeMedium, setStrokeMedium] = useState<string>('2');
+  const [strokeBig, setStrokeBig] = useState<string>('3');
+  const [strokeLarge, setStrokeLarge] = useState<string>('4');
+  const [selectedOption, setSelectedOption] = useState<SelectProps.Option>({ label: 'Option 1', value: '1' });
+
+  // Reload page once after initial load to fix theme application
+  useLayoutEffect(() => {
+    const hasReloaded = sessionStorage.getItem('themed-stroke-width-reloaded');
+    if (!hasReloaded) {
+      sessionStorage.setItem('themed-stroke-width-reloaded', 'true');
+      window.location.reload();
+    }
+  }, []);
+
+  useLayoutEffect(() => {
+    let reset: () => void = () => {};
+    if (themed) {
+      const theme: Theme = {
+        tokens: {
+          borderWidthIconSmall: strokeSmall ? `${strokeSmall}px` : '1px',
+          borderWidthIconNormal: strokeNormal ? `${strokeNormal}px` : '1px',
+          borderWidthIconMedium: strokeMedium ? `${strokeMedium}px` : '1px',
+          borderWidthIconBig: strokeBig ? `${strokeBig}px` : '1.5px',
+          borderWidthIconLarge: strokeLarge ? `${strokeLarge}px` : '2px',
+        },
+      };
+
+      const result = applyTheme({
+        theme,
+        baseThemeId: 'visual-refresh',
+      });
+      reset = result.reset;
+    }
+    return reset;
+  }, [themed, strokeSmall, strokeNormal, strokeMedium, strokeBig, strokeLarge]);
+
+  return (
+    <div style={{ padding: 15 }}>
+      <h1>Themed icon stroke width</h1>
+      <SpaceBetween size="l" direction="vertical">
+        <div style={{ display: 'grid', gridTemplateColumns: 'repeat(5, 1fr)', gap: '10px', maxWidth: '800px' }}>
+          <FormField label="Small (16px)">
+            <Input
+              type="number"
+              value={strokeSmall}
+              onChange={evt => {
+                const numValue = parseFloat(evt.detail.value);
+                if (!isNaN(numValue) && numValue >= 1 && numValue <= 10) {
+                  setStrokeSmall(evt.detail.value);
+                } else if (evt.detail.value === '') {
+                  setStrokeSmall(evt.detail.value);
+                }
+              }}
+              placeholder="1px"
+              step={0.5}
+              inputMode="decimal"
+            />
+          </FormField>
+
+          <FormField label="Normal (16px)">
+            <Input
+              type="number"
+              value={strokeNormal}
+              onChange={evt => {
+                const numValue = parseFloat(evt.detail.value);
+                if (!isNaN(numValue) && numValue >= 1 && numValue <= 10) {
+                  setStrokeNormal(evt.detail.value);
+                } else if (evt.detail.value === '') {
+                  setStrokeNormal(evt.detail.value);
+                }
+              }}
+              placeholder="1px"
+              step={0.5}
+              inputMode="decimal"
+            />
+          </FormField>
+
+          <FormField label="Medium (20px)">
+            <Input
+              type="number"
+              value={strokeMedium}
+              onChange={evt => {
+                const numValue = parseFloat(evt.detail.value);
+                if (!isNaN(numValue) && numValue >= 1 && numValue <= 10) {
+                  setStrokeMedium(evt.detail.value);
+                } else if (evt.detail.value === '') {
+                  setStrokeMedium(evt.detail.value);
+                }
+              }}
+              placeholder="1px"
+              step={0.5}
+              inputMode="decimal"
+            />
+          </FormField>
+
+          <FormField label="Big (32px)">
+            <Input
+              type="number"
+              value={strokeBig}
+              onChange={evt => {
+                const numValue = parseFloat(evt.detail.value);
+                if (!isNaN(numValue) && numValue >= 1 && numValue <= 10) {
+                  setStrokeBig(evt.detail.value);
+                } else if (evt.detail.value === '') {
+                  setStrokeBig(evt.detail.value);
+                }
+              }}
+              placeholder="1.5px"
+              step={0.5}
+              inputMode="decimal"
+            />
+          </FormField>
+
+          <FormField label="Large (48px)">
+            <Input
+              type="number"
+              value={strokeLarge}
+              onChange={evt => {
+                const numValue = parseFloat(evt.detail.value);
+                if (!isNaN(numValue) && numValue >= 1 && numValue <= 10) {
+                  setStrokeLarge(evt.detail.value);
+                } else if (evt.detail.value === '') {
+                  setStrokeLarge(evt.detail.value);
+                }
+              }}
+              placeholder="2px"
+              step={0.5}
+              inputMode="decimal"
+            />
+          </FormField>
+        </div>
+
+        <label>
+          <input
+            type="checkbox"
+            data-testid="apply-theme"
+            checked={themed}
+            onChange={evt => setThemed(evt.currentTarget.checked)}
+          />
+          <span style={{ marginInlineStart: 5 }}>Apply custom stroke width themes</span>
+        </label>
+      </SpaceBetween>
+
+      <ScreenshotArea
+        key={`themed-${themed}-${strokeSmall}-${strokeNormal}-${strokeMedium}-${strokeBig}-${strokeLarge}`}
+      >
+        <SpaceBetween size="xl">
+          <Box variant="h2" padding={{ top: 'l' }}>
+            Icon sizes
+          </Box>
+
+          <SpaceBetween size="xs">
+            <Box variant="h3">Small (16px with shorter wrapper size)</Box>
+            <div className={styles.wrapper}>
+              {Object.keys(icons).map(icon => (
+                <Icon key={icon} name={icon as IconProps['name']} variant="normal" size="small" />
+              ))}
+            </div>
+          </SpaceBetween>
+
+          <SpaceBetween size="xs">
+            <Box variant="h3">Normal (16px)</Box>
+            <div className={styles.wrapper}>
+              {Object.keys(icons).map(icon => (
+                <Icon key={icon} name={icon as IconProps['name']} variant="normal" size="normal" />
+              ))}
+            </div>
+          </SpaceBetween>
+
+          <SpaceBetween size="xs">
+            <Box variant="h3">Medium (20px)</Box>
+            <div className={styles.wrapper}>
+              {Object.keys(icons).map(icon => (
+                <Icon key={icon} name={icon as IconProps['name']} variant="normal" size="medium" />
+              ))}
+            </div>
+          </SpaceBetween>
+
+          <SpaceBetween size="xs">
+            <Box variant="h3">Big (32px)</Box>
+            <div className={styles.wrapper}>
+              {Object.keys(icons).map(icon => (
+                <Icon key={icon} name={icon as IconProps['name']} variant="normal" size="big" />
+              ))}
+            </div>
+          </SpaceBetween>
+
+          <SpaceBetween size="xs">
+            <Box variant="h3">Large (48px)</Box>
+            <div className={styles.wrapper}>
+              {Object.keys(icons).map(icon => (
+                <Icon key={icon} name={icon as IconProps['name']} variant="normal" size="large" />
+              ))}
+            </div>
+          </SpaceBetween>
+
+          <Box variant="h2" padding={{ top: 'l' }}>
+            Inline Context Examples
+          </Box>
+
+          <SpaceBetween size="m">
+            <div>
+              <Button iconName="call" variant="primary">
+                Button
+              </Button>
+            </div>
+
+            <div>
+              <Link external={true} href="https://example.com/" variant="primary">
+                Learn more
+              </Link>
+            </div>
+
+            <div style={{ maxWidth: '300px' }}>
+              <Select
+                selectedOption={selectedOption}
+                onChange={({ detail }) => setSelectedOption(detail.selectedOption)}
+                options={[
+                  { label: 'Option 1', value: '1', iconName: 'settings' },
+                  { label: 'Option 2', value: '2', iconName: 'unlocked' },
+                  { label: 'Option 3', value: '3', iconName: 'share' },
+                ]}
+              />
+            </div>
+
+            <div style={{ maxWidth: '300px' }}>
+              <FormField
+                label="Email address"
+                errorText="Please enter a valid email address"
+                constraintText="Use your company email."
+              >
+                <Input value="invalid-email" type="email" readOnly={true} />
+              </FormField>
+            </div>
+
+            <SpaceBetween size="xs">
+              <StatusIndicator type="error">Error</StatusIndicator>
+              <StatusIndicator type="success">Success</StatusIndicator>
+              <StatusIndicator type="warning">Warning</StatusIndicator>
+              <StatusIndicator type="info">Info</StatusIndicator>
+            </SpaceBetween>
+            <IconProvider
+              icons={{
+                'status-positive': (
+                  <svg viewBox="0 0 16 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M5 9L7 11L11 7" />
+                    <path d="M8 2C6.29 3.53 4.13 4.32 2 4.48V7.96C2 10.01 2.76 11.84 3.71 13.1C4.63 14.32 6.03 15.31 8 16C9.97 15.31 11.37 14.32 12.29 13.1C13.3935 11.6128 13.9926 9.81183 14 7.96V4.48C11.87 4.32 9.71 3.52 8 2Z" />
+                  </svg>
+                ),
+              }}
+            >
+              <SpaceBetween size="xs">
+                <Box variant="h2" padding={{ top: 'l' }}>
+                  Custom icon using icon-provider component
+                </Box>
+                <KeyValuePairs
+                  columns={1}
+                  items={[
+                    {
+                      label: 'Custom icon in a status indicator',
+                      value: <StatusIndicator type="success">Two-factor authentication enabled</StatusIndicator>,
+                    },
+                    {
+                      label: 'Custom icon in an alert',
+                      value: (
+                        <Alert type="success" statusIconAriaLabel="Success">
+                          Two-factor authentication enabled successfully.
+                        </Alert>
+                      ),
+                    },
+                    {
+                      label: 'Custom icon in a flashbar',
+                      value: (
+                        <Flashbar
+                          items={[
+                            {
+                              type: 'success',
+                              content: 'Two-factor authentication enabled successfully.',
+                              statusIconAriaLabel: 'Success',
+                            },
+                          ]}
+                        />
+                      ),
+                    },
+                  ]}
+                />
+              </SpaceBetween>
+            </IconProvider>
+            <p style={{ lineHeight: '28px', fontSize: '18px' }}>
+              Lorem ipsum dolor sit amet,{' '}
+              <Link external={true} href="#">
+                Learn more
+              </Link>{' '}
+              consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad
+              minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
+              irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
+              sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
+            </p>
+          </SpaceBetween>
+        </SpaceBetween>
+      </ScreenshotArea>
+    </div>
+  );
+}
diff --git a/src/__integ__/__snapshots__/themes.test.ts.snap b/src/__integ__/__snapshots__/themes.test.ts.snap
index 0e993e261f..8f6262f9b7 100644
--- a/src/__integ__/__snapshots__/themes.test.ts.snap
+++ b/src/__integ__/__snapshots__/themes.test.ts.snap
@@ -45,6 +45,11 @@ exports[`CSS Custom Properties match previous snapshot for mode "compact" 1`] =
   "border-width-button": "1px",
   "border-width-dropdown": "1px",
   "border-width-field": "1px",
+  "border-width-icon-big": "3px",
+  "border-width-icon-large": "4px",
+  "border-width-icon-medium": "2px",
+  "border-width-icon-normal": "2px",
+  "border-width-icon-small": "2px",
   "border-width-popover": "1px",
   "border-width-token": "1px",
   "color-background-avatar-default": "#545b64",
@@ -727,6 +732,11 @@ exports[`CSS Custom Properties match previous snapshot for mode "dark" 1`] = `
   "border-width-button": "1px",
   "border-width-dropdown": "1px",
   "border-width-field": "1px",
+  "border-width-icon-big": "3px",
+  "border-width-icon-large": "4px",
+  "border-width-icon-medium": "2px",
+  "border-width-icon-normal": "2px",
+  "border-width-icon-small": "2px",
   "border-width-popover": "1px",
   "border-width-token": "1px",
   "color-background-avatar-default": "#545b64",
@@ -1409,6 +1419,11 @@ exports[`CSS Custom Properties match previous snapshot for mode "light" 1`] = `
   "border-width-button": "1px",
   "border-width-dropdown": "1px",
   "border-width-field": "1px",
+  "border-width-icon-big": "3px",
+  "border-width-icon-large": "4px",
+  "border-width-icon-medium": "2px",
+  "border-width-icon-normal": "2px",
+  "border-width-icon-small": "2px",
   "border-width-popover": "1px",
   "border-width-token": "1px",
   "color-background-avatar-default": "#545b64",
@@ -2091,6 +2106,11 @@ exports[`CSS Custom Properties match previous snapshot for mode "reduced-motion"
   "border-width-button": "1px",
   "border-width-dropdown": "1px",
   "border-width-field": "1px",
+  "border-width-icon-big": "3px",
+  "border-width-icon-large": "4px",
+  "border-width-icon-medium": "2px",
+  "border-width-icon-normal": "2px",
+  "border-width-icon-small": "2px",
   "border-width-popover": "1px",
   "border-width-token": "1px",
   "color-background-avatar-default": "#545b64",
@@ -2773,6 +2793,11 @@ exports[`CSS Custom Properties match previous snapshot for mode "visual-refresh"
   "border-width-button": "2px",
   "border-width-dropdown": "2px",
   "border-width-field": "1px",
+  "border-width-icon-big": "3px",
+  "border-width-icon-large": "4px",
+  "border-width-icon-medium": "2px",
+  "border-width-icon-normal": "2px",
+  "border-width-icon-small": "2px",
   "border-width-popover": "2px",
   "border-width-token": "2px",
   "color-background-avatar-default": "#424650",
@@ -3455,6 +3480,11 @@ exports[`CSS Custom Properties match previous snapshot for mode "visual-refresh-
   "border-width-button": "2px",
   "border-width-dropdown": "2px",
   "border-width-field": "1px",
+  "border-width-icon-big": "3px",
+  "border-width-icon-large": "4px",
+  "border-width-icon-medium": "2px",
+  "border-width-icon-normal": "2px",
+  "border-width-icon-small": "2px",
   "border-width-popover": "2px",
   "border-width-token": "2px",
   "color-background-avatar-default": "#424650",
@@ -4137,6 +4167,11 @@ exports[`CSS Custom Properties match previous snapshot for mode "visual-refresh-
   "border-width-button": "2px",
   "border-width-dropdown": "2px",
   "border-width-field": "1px",
+  "border-width-icon-big": "3px",
+  "border-width-icon-large": "4px",
+  "border-width-icon-medium": "2px",
+  "border-width-icon-normal": "2px",
+  "border-width-icon-small": "2px",
   "border-width-popover": "2px",
   "border-width-token": "2px",
   "color-background-avatar-default": "#424650",
@@ -4819,6 +4854,11 @@ exports[`CSS Custom Properties match previous snapshot for mode "visual-refresh-
   "border-width-button": "2px",
   "border-width-dropdown": "2px",
   "border-width-field": "1px",
+  "border-width-icon-big": "3px",
+  "border-width-icon-large": "4px",
+  "border-width-icon-medium": "2px",
+  "border-width-icon-normal": "2px",
+  "border-width-icon-small": "2px",
   "border-width-popover": "2px",
   "border-width-token": "2px",
   "color-background-avatar-default": "#424650",
diff --git a/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap b/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap
index fc7efac8a6..9acd5fbf8d 100644
--- a/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap
+++ b/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap
@@ -93,6 +93,26 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "1px",
@@ -2753,6 +2773,26 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "1px",
@@ -5413,6 +5453,26 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "1px",
@@ -8073,6 +8133,26 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "1px",
@@ -10733,6 +10813,26 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "1px",
@@ -13393,6 +13493,26 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "1px",
@@ -16053,6 +16173,26 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
       "$description": "The border width of form fields.",
       "$value": "1px",
     },
+    "border-width-icon-big": {
+      "$description": "The visual stroke width of big icons.",
+      "$value": "3px",
+    },
+    "border-width-icon-large": {
+      "$description": "The visual stroke width of large icons.",
+      "$value": "4px",
+    },
+    "border-width-icon-medium": {
+      "$description": "The visual stroke width of medium icons.",
+      "$value": "2px",
+    },
+    "border-width-icon-normal": {
+      "$description": "The visual stroke width of normal icons.",
+      "$value": "2px",
+    },
+    "border-width-icon-small": {
+      "$description": "The visual stroke width of small icons.",
+      "$value": "2px",
+    },
     "border-width-popover": {
       "$description": "The border width of popovers.",
       "$value": "1px",
@@ -18718,6 +18858,26 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "2px",
@@ -21378,6 +21538,26 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "2px",
@@ -24038,6 +24218,26 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "2px",
@@ -26698,6 +26898,26 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "2px",
@@ -29358,6 +29578,26 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "2px",
@@ -32018,6 +32258,26 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "2px",
@@ -34678,6 +34938,26 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "2px",
@@ -37338,6 +37618,26 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
           "$description": "The border width of form fields.",
           "$value": "1px",
         },
+        "border-width-icon-big": {
+          "$description": "The visual stroke width of big icons.",
+          "$value": "3px",
+        },
+        "border-width-icon-large": {
+          "$description": "The visual stroke width of large icons.",
+          "$value": "4px",
+        },
+        "border-width-icon-medium": {
+          "$description": "The visual stroke width of medium icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-normal": {
+          "$description": "The visual stroke width of normal icons.",
+          "$value": "2px",
+        },
+        "border-width-icon-small": {
+          "$description": "The visual stroke width of small icons.",
+          "$value": "2px",
+        },
         "border-width-popover": {
           "$description": "The border width of popovers.",
           "$value": "2px",
@@ -39998,6 +40298,26 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
       "$description": "The border width of form fields.",
       "$value": "1px",
     },
+    "border-width-icon-big": {
+      "$description": "The visual stroke width of big icons.",
+      "$value": "3px",
+    },
+    "border-width-icon-large": {
+      "$description": "The visual stroke width of large icons.",
+      "$value": "4px",
+    },
+    "border-width-icon-medium": {
+      "$description": "The visual stroke width of medium icons.",
+      "$value": "2px",
+    },
+    "border-width-icon-normal": {
+      "$description": "The visual stroke width of normal icons.",
+      "$value": "2px",
+    },
+    "border-width-icon-small": {
+      "$description": "The visual stroke width of small icons.",
+      "$value": "2px",
+    },
     "border-width-popover": {
       "$description": "The border width of popovers.",
       "$value": "2px",
diff --git a/src/icon/icons/at-symbol.svg b/src/icon/icons/at-symbol.svg
index da83645b74..6b5583f2ae 100644
--- a/src/icon/icons/at-symbol.svg
+++ b/src/icon/icons/at-symbol.svg
@@ -1,3 +1,4 @@
 <svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
-<path d="M8.90723 1.00488C10.1804 1.00488 11.2699 1.23451 12.1748 1.69336C13.0902 2.14177 13.7904 2.79336 14.2744 3.64844C14.7584 4.49309 15 5.51048 15 6.69922C14.9999 7.68971 14.842 8.56601 14.5264 9.32715C14.2107 10.0882 13.7744 10.6829 13.2168 11.1104C12.6592 11.5379 12.0118 11.7509 11.2754 11.751C10.7915 11.751 10.3704 11.6626 10.0127 11.4854C9.65493 11.3081 9.38591 11.0577 9.20703 10.7344C8.93349 11.0471 8.59191 11.3029 8.18164 11.501C7.77127 11.6887 7.36057 11.7822 6.9502 11.7822C6.16112 11.7822 5.5566 11.537 5.13574 11.0469C4.71487 10.5567 4.50391 9.85321 4.50391 8.93555C4.50391 8.30987 4.59869 7.71545 4.78809 7.15234C4.97749 6.58923 5.23534 6.08837 5.56152 5.65039C5.88761 5.2126 6.26093 4.86839 6.68164 4.61816C7.11298 4.36793 7.56054 4.24321 8.02344 4.24316C8.77052 4.24316 9.36568 4.51957 9.80762 5.07227L9.90234 4.83691C9.95485 4.69134 10.0122 4.5974 10.0752 4.55566C10.1489 4.50352 10.2599 4.47754 10.4072 4.47754H11.2598C11.4803 4.47767 11.5907 4.5714 11.5908 4.75879C11.5908 4.82136 11.5745 4.94186 11.543 5.11914L10.8174 9.32715C10.7859 9.52504 10.7695 9.66566 10.7695 9.74902C10.7695 10.1244 10.9805 10.3125 11.4014 10.3125C11.7486 10.3125 12.0594 10.1556 12.333 9.84277C12.6169 9.53003 12.8373 9.10246 12.9951 8.56055C13.1529 8.0184 13.2324 7.40292 13.2324 6.71484C13.2324 5.38002 12.8533 4.36276 12.0957 3.66406C11.3487 2.95504 10.265 2.60064 8.84473 2.60059C7.99242 2.60059 7.20261 2.76168 6.47656 3.08496C5.7611 3.39781 5.13524 3.84152 4.59863 4.41504C4.07256 4.97814 3.6618 5.65055 3.36719 6.43262C3.07257 7.20428 2.92579 8.04914 2.92578 8.9668C2.92578 10.3955 3.29371 11.4907 4.03027 12.252C4.76684 13.0236 5.8247 13.4092 7.20312 13.4092C7.57132 13.4092 7.90269 13.3832 8.19727 13.3311C8.50241 13.2893 8.81834 13.227 9.14453 13.1436C9.29169 13.1019 9.39684 13.0707 9.45996 13.0498C9.5231 13.0394 9.57607 13.0342 9.61816 13.0342C9.81782 13.0343 9.91793 13.1435 9.91797 13.3623V14.0664C9.91796 14.2018 9.89136 14.3059 9.83887 14.3789C9.79678 14.4519 9.70709 14.5143 9.57031 14.5664C8.81274 14.8584 7.96063 15.0049 7.01367 15.0049C5.76163 15.0049 4.68319 14.7648 3.77832 14.2852C2.88392 13.8055 2.19399 13.1175 1.70996 12.2207C1.23645 11.3239 1 10.2494 1 8.99805C1.00001 7.85115 1.19478 6.79292 1.58398 5.82324C1.98379 4.84309 2.53632 3.99294 3.24121 3.27344C3.95673 2.55388 4.79344 1.99589 5.75098 1.59961C6.71894 1.20337 7.77094 1.00492 8.90723 1.00488ZM8.48145 5.74414C8.13421 5.74414 7.81828 5.88023 7.53418 6.15137C7.25017 6.42247 7.01868 6.78738 6.83984 7.24609C6.67149 7.69451 6.58691 8.19535 6.58691 8.74805C6.58695 9.76992 6.95585 10.2812 7.69238 10.2812C8.16579 10.2812 8.59196 10.0515 8.9707 9.59277C8.9707 9.47806 8.98601 9.30559 9.01758 9.07617L9.53906 6.02637C9.18132 5.83867 8.82867 5.74415 8.48145 5.74414Z" class="filled no-stroke"/>
-</svg>
\ No newline at end of file
+<path class="stroke-linecapround" d="M10.0867 14.2624C7.88392 15.074 2.85239 15.5145 1.73935 10.784C0.626317 6.05343 3.49016 3.1319 5.44701 2.08818C7.48343 1.002 11.5545 0.451444 13.565 3.13195C15.6519 5.91441 14.2606 10.0882 12.8693 10.784C11.478 11.4798 10.7128 11.0622 10.4346 10.784C10.3709 10.7203 10.3181 10.6493 10.2746 10.5735C9.9887 10.0754 10.1415 9.45659 10.2501 8.89262L10.9999 5.00213" />
+<path d="M10.999 6.50195C10.6512 6.03819 9.61267 5.00195 8.49963 5.00195C7.10832 5.00195 5.56447 6.26257 5.21664 8.34952C4.86881 10.4365 5.9128 11.2713 6.9559 11.2713C7.99899 11.2713 9.39068 10.7843 10.0863 9.74083" />
+</svg>
diff --git a/src/icon/icons/history.svg b/src/icon/icons/history.svg
index eae36ceb50..efd8380dc2 100644
--- a/src/icon/icons/history.svg
+++ b/src/icon/icons/history.svg
@@ -1,4 +1,5 @@
 <svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
-<path d="M8 16.0049C12.4223 16.0049 16 12.4272 16 8.00488C16 3.5826 12.4223 0.0048832 8 0.00488281C5.61087 0.00488277 3.46766 1.05153 2 2.71289V0.00488281H0V5.00488C0 5.27149 0.106629 5.52708 0.295898 5.71484C0.485113 5.9025 0.741333 6.00696 1.00781 6.00488L6.00781 5.96484L5.99219 3.96484L3.54785 3.98438C4.64906 2.76727 6.23561 2.00488 8 2.00488C11.3177 2.00488 14 4.68717 14 8.00488C14 11.3226 11.3177 14.0049 8 14.0049C4.68228 14.0049 2 11.3226 2 8.00488H0C-8.22761e-08 12.4272 3.57772 16.0049 8 16.0049Z" class="filled no-stroke" />
-<path d="M9 10.0049C9.55229 10.0049 10 9.55717 10 9.00488V4.00488H8V8.00488H5V10.0049H9Z" class="filled no-stroke" />
-</svg>
\ No newline at end of file
+<path d="M1 0L1 5L6 4.95999" class="stroke-linejoin-round"/>
+<path d="M1 8C1 11.87 4.13 15 8 15C11.87 15 15 11.87 15 8C15 4.13 11.87 1 8 1C5.21 1 2.80001 2.63 1.67001 5" />
+<path d="M9 4V9H5" class="stroke-linejoin-round"/>
+</svg>
diff --git a/src/icon/icons/slash.svg b/src/icon/icons/slash.svg
index b938672f69..497b86bc8b 100644
--- a/src/icon/icons/slash.svg
+++ b/src/icon/icons/slash.svg
@@ -1,4 +1,4 @@
 <svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
-<path d="M10.9688 5.05859L7 12.0049L5.26367 11.0127L9.23242 4.06641L10.9688 5.05859Z" class="filled no-stroke" />
-<path d="M14 0.00488281C15.1046 0.00488301 16 0.900313 16 2.00488V14.0049C16 15.1095 15.1046 16.0049 14 16.0049H2C0.895431 16.0049 2.41596e-08 15.1095 0 14.0049V2.00488C1.9328e-07 0.900314 0.89543 0.00488284 2 0.00488281H14ZM2 14.0049H14V2.00488H2V14.0049Z" class="filled no-stroke" />
+<path d="M10 4.5L6 11.5" />
+<rect x="1" y="1" width="14" height="14" rx="1" />
 </svg>
\ No newline at end of file
diff --git a/src/icon/mixins.scss b/src/icon/mixins.scss
index 1b71014c07..59b29343b0 100644
--- a/src/icon/mixins.scss
+++ b/src/icon/mixins.scss
@@ -23,31 +23,36 @@ $_icon-sizes: (
     name: 'small',
     size: awsui.$size-icon-normal,
     supportedLineHeight: awsui.$line-height-body-s,
-    stroke: 2px,
+    stroke: awsui.$border-width-icon-small,
+    scaleFactor: 1,
   ),
   (
     name: 'normal',
     size: awsui.$size-icon-normal,
     supportedLineHeight: awsui.$line-height-body-m,
-    stroke: 2px,
+    stroke: awsui.$border-width-icon-normal,
+    scaleFactor: 1,
   ),
   (
     name: 'medium',
     size: awsui.$size-icon-medium,
     supportedLineHeight: awsui.$line-height-heading-l,
-    stroke: 1.6px,
+    stroke: awsui.$border-width-icon-medium,
+    scaleFactor: 1.25,
   ),
   (
     name: 'big',
     size: awsui.$size-icon-big,
     supportedLineHeight: awsui.$line-height-heading-xl,
-    stroke: 1.5px,
+    stroke: awsui.$border-width-icon-big,
+    scaleFactor: 2,
   ),
   (
     name: 'large',
     size: awsui.$size-icon-large,
     supportedLineHeight: awsui.$line-height-display-l,
-    stroke: 1.333px,
+    stroke: awsui.$border-width-icon-large,
+    scaleFactor: 3,
   )
 );
 
@@ -57,6 +62,7 @@ $_icon-sizes: (
     $size: map.get($type, 'size');
     $supportedLineHeight: map.get($type, 'supportedLineHeight');
     $stroke: map.get($type, 'stroke');
+    $scaleFactor: map.get($type, 'scaleFactor');
     $padding: calc((#{$supportedLineHeight} - #{$size}) / 2);
 
     &.size-#{$name} {
@@ -78,7 +84,7 @@ $_icon-sizes: (
       > svg {
         &,
         * {
-          stroke-width: $stroke;
+          stroke-width: calc(#{$stroke} / #{$scaleFactor});
         }
       }
     }
diff --git a/style-dictionary/utils/token-names.ts b/style-dictionary/utils/token-names.ts
index 4a41c89eaa..eda079635e 100644
--- a/style-dictionary/utils/token-names.ts
+++ b/style-dictionary/utils/token-names.ts
@@ -859,7 +859,12 @@ export type BordersTokenName =
   | 'borderWidthDropdown'
   | 'borderWidthField'
   | 'borderWidthPopover'
-  | 'borderWidthToken';
+  | 'borderWidthToken'
+  | 'borderWidthIconSmall'
+  | 'borderWidthIconNormal'
+  | 'borderWidthIconMedium'
+  | 'borderWidthIconBig'
+  | 'borderWidthIconLarge';
 export type MotionTokenName =
   | 'motionDurationExtraFast'
   | 'motionDurationExtraSlow'
diff --git a/style-dictionary/visual-refresh/borders.ts b/style-dictionary/visual-refresh/borders.ts
index de12e168d6..ea3b3d3b89 100644
--- a/style-dictionary/visual-refresh/borders.ts
+++ b/style-dictionary/visual-refresh/borders.ts
@@ -47,4 +47,9 @@ export const tokens: StyleDictionary.BordersDictionary = {
   borderWidthField: '1px',
   borderWidthPopover: '2px',
   borderWidthToken: '2px',
+  borderWidthIconSmall: '2px',
+  borderWidthIconNormal: '2px',
+  borderWidthIconMedium: '2px',
+  borderWidthIconBig: '3px',
+  borderWidthIconLarge: '4px',
 };
diff --git a/style-dictionary/visual-refresh/metadata/borders.ts b/style-dictionary/visual-refresh/metadata/borders.ts
index c971cad076..bfe420cac7 100644
--- a/style-dictionary/visual-refresh/metadata/borders.ts
+++ b/style-dictionary/visual-refresh/metadata/borders.ts
@@ -139,6 +139,31 @@ const metadata: StyleDictionary.MetadataIndex = {
     public: true,
     themeable: true,
   },
+  borderWidthIconSmall: {
+    description: 'The visual stroke width of small icons.',
+    public: true,
+    themeable: true,
+  },
+  borderWidthIconNormal: {
+    description: 'The visual stroke width of normal icons.',
+    public: true,
+    themeable: true,
+  },
+  borderWidthIconMedium: {
+    description: 'The visual stroke width of medium icons.',
+    public: true,
+    themeable: true,
+  },
+  borderWidthIconBig: {
+    description: 'The visual stroke width of big icons.',
+    public: true,
+    themeable: true,
+  },
+  borderWidthIconLarge: {
+    description: 'The visual stroke width of large icons.',
+    public: true,
+    themeable: true,
+  },
 };
 
 export default metadata;