diff --git a/site/docs/foundations/density.mdx b/site/docs/foundations/density.mdx
index 3262543b2e0..418e1199b97 100644
--- a/site/docs/foundations/density.mdx
+++ b/site/docs/foundations/density.mdx
@@ -3,7 +3,7 @@ title: Density
 layout: DetailTechnical
 ---
 
-Density relates to the amount of content that can fit on a screen based on the [size](size) and [spacing](spacing) of components.
+Density relates to the amount of content that can fit on a screen based on the [size](./size) and [spacing](./spacing) of components.
 
 When creating a product using the design system, choose a base density as a starting point. All components, spacing, and typographic elements will align and remain proportionate regardless of the density you choose.
 
@@ -45,13 +45,13 @@ Don't use touch density for anything other than mobile or tablet experiences. Fo
 
 ## Mixing densities
 
-Density is intended to be used one density at a time, only changing when part of a [responsive layout](/salt/foundations/responsiveness). When applying density:
+Density is intended to be used one density at a time, only changing when part of a [responsive layout](./responsiveness). When applying density:
 
 - Pick a density and be consistent with it across your application
 - Alternatively, set density to align to breakpoints and define which density to use per breakpoint
 - If the use case requires it, mix densities, but do it sparingly in order to provide greater emphasis to a single component or small group of components, such as log-in fields.
 
-The [Responsiveness](/salt/foundations/responsiveness) foundation includes guidance on recommended breakpoints for each density.
+The [Responsiveness](./responsiveness) foundation includes guidance on recommended breakpoints for each density.
 
 Before mixing densities, consider other ways to establish hierarchy or emphasise certain elements, such as:
 
@@ -62,6 +62,6 @@ Before mixing densities, consider other ways to establish hierarchy or emphasise
 
 If you still need to mix densities, do it sparingly. Although possible, the components within the system are not designed to be mixed. This does not mean they can't be mixed, but they are designed around a specific scaling system that ensures components of the same density align. The components are not designed to 'fit' together across densities.
 
-Mixing the density of components sparingly can help to create emphasis without visual disruption. However, if overused, there may be issues with component alignment and use of [spacing tokens](spacing).
+Mixing the density of components sparingly can help to create emphasis without visual disruption. However, if overused, there may be issues with component alignment and use of [spacing tokens](./spacing).
 
 :fragment{src="./fragments/feedback.mdx"}
diff --git a/site/docs/foundations/division.mdx b/site/docs/foundations/division.mdx
index eeb598efaa6..e4b12ebafeb 100644
--- a/site/docs/foundations/division.mdx
+++ b/site/docs/foundations/division.mdx
@@ -13,7 +13,7 @@ Negative space is the area between design elements. It can also be the space wit
 
 Negative space should be the first option when dividing regions, blocks of content or elements within a design. It's an elegant visual divider that helps break up an interface without creating visual clutter.
 
-You can find further guidance in the [Spacing foundation](/salt/foundations/spacing).
+You can find further guidance in the [Spacing foundation](./spacing).
 
 <Image
   src="/img/foundations/division-negativespace.svg"
diff --git a/site/docs/foundations/duration.mdx b/site/docs/foundations/duration.mdx
index 6812341b08e..60e971ccf42 100644
--- a/site/docs/foundations/duration.mdx
+++ b/site/docs/foundations/duration.mdx
@@ -63,7 +63,7 @@ The time between `salt-duration-notable` and `salt-duration-cutoff` indicates th
 
 #### Recommended visual feedback:
 
-[Spinner](https://storybook.saltdesignsystem.com/?path=/story/documentation-core-spinner--docs) is a visual representation of a process that is taking an indeterminate amount of time to complete. A spinner can be displayed at any point between `salt-duration-notable` and `salt-duration-cutoff`, but should not be displayed any sooner, as the assumption should be that the user's actions will have completed before it's necessary to show a loading state.
+[Spinner](../components/spinner) is a visual representation of a process that is taking an indeterminate amount of time to complete. A spinner can be displayed at any point between `salt-duration-notable` and `salt-duration-cutoff`, but should not be displayed any sooner, as the assumption should be that the user's actions will have completed before it's necessary to show a loading state.
 
 <Image
   src="/img/foundations/duration-timebetween.svg"
diff --git a/site/docs/foundations/responsiveness.mdx b/site/docs/foundations/responsiveness.mdx
index f9da7259859..25399350775 100644
--- a/site/docs/foundations/responsiveness.mdx
+++ b/site/docs/foundations/responsiveness.mdx
@@ -23,7 +23,7 @@ A responsive layout is made up of a set of consistently proportioned columns, se
 
 Basic layout grids are included in the design system to provide a starting point for designing any user interface.
 
-The gutters and margins are set using `--salt-spacing-300` across all densities. The number of columns and their widths vary depending on the density and breakpoint set. Find all you need to know about densities on the [Density foundation](/salt/foundations/density)
+The gutters and margins are set using `--salt-spacing-300` across all densities. The number of columns and their widths vary depending on the density and breakpoint set. Find all you need to know about densities on the [Density foundation](./density)
 
 | Token                | High density (px) | Medium | Low | Touch |
 | -------------------- | ----------------- | ------ | --- | ----- |
diff --git a/site/docs/foundations/scale.mdx b/site/docs/foundations/scale.mdx
index 12069c93729..8581db8fbf9 100644
--- a/site/docs/foundations/scale.mdx
+++ b/site/docs/foundations/scale.mdx
@@ -5,13 +5,13 @@ layout: DetailTechnical
 
 Scale allows you to give components greater or lesser prominence within an interface through a multiplier of their default size.
 
-Scale works hand-in-hand with [density](density) to allow the prominence of components such as Avatar and Country Symbol to be changed within a layout.
+Scale works hand-in-hand with [density](./density) to allow the prominence of components such as Avatar and Country Symbol to be changed within a layout.
 
 This is achieved by applying a multiplier to the component. By default, scale is set to x1, applying x2 will double the size of the component, x3 will triple the size, etc. Scale can be used in conjunction with a size-token, as the following examples and tables show.
 
 ## Scale and size
 
-The [Size](size) foundation establishes standard dimensions across the system. This ensures components maintain a consistent spatial relationship to the elements around them.
+The [Size](./size) foundation establishes standard dimensions across the system. This ensures components maintain a consistent spatial relationship to the elements around them.
 
 ### Scaling size-base
 
diff --git a/site/docs/foundations/size.mdx b/site/docs/foundations/size.mdx
index 7d92cd21f5c..84cbe9e80ce 100644
--- a/site/docs/foundations/size.mdx
+++ b/site/docs/foundations/size.mdx
@@ -19,7 +19,7 @@ Size refers to the restricted dimensions provided within the design system, such
 
 ## Base
 
-`salt-size-base` is the fixed default height for base components in each [density](/salt/foundations/density) within the design system. It ensures the consistent alignment of components in horizontal layouts, as well as the vertical alignments of the text values within them. This means the text within each component sits on the same baseline.
+`salt-size-base` is the fixed default height for base components in each [density](./density) within the design system. It ensures the consistent alignment of components in horizontal layouts, as well as the vertical alignments of the text values within them. This means the text within each component sits on the same baseline.
 
 <ImageSwitcher
   images={[
@@ -31,7 +31,7 @@ Size refers to the restricted dimensions provided within the design system, such
 
 ### Nesting size-base
 
-Using size-base, in conjunction with a [spacing token](/salt/foundations/spacing) above and below, creates a consistent height for components that can nest a `--salt-size-base` component within them. This provides further standardized heights across the design system.
+Using size-base, in conjunction with a [spacing token](./spacing) above and below, creates a consistent height for components that can nest a `--salt-size-base` component within them. This provides further standardized heights across the design system.
 
 The following example shows how components can use `--salt-size-base` and `--salt-spacing-50` (top and bottom) to define the height of a component or stackable element, such as a Data Grid row. The height allows a size-base component to be contained within it, but it is not dependent on the component to force the height.
 
@@ -45,7 +45,7 @@ The following example shows how components can use `--salt-size-base` and `--sal
 
 ## Selectable
 
-`--salt-size-selectable` is used to set the dimensions of selectable components, including [Radio Button](https://storybook.saltdesignsystem.com/?path=/docs/documentation-core-radio-button--docs), [Checkbox](https://storybook.saltdesignsystem.com/?path=/docs/documentation-core-checkbox--docs), and Switch.
+`--salt-size-selectable` is used to set the dimensions of selectable components, including [Radio Button](../components/radio-button), [Checkbox](../components/checkbox), and Switch.
 
 <ImageSwitcher
   images={[
@@ -59,11 +59,11 @@ The following example shows how components can use `--salt-size-base` and `--sal
 
 `--salt-size-icon` controls the size of all icons throughout the design system. Icons are designed to be displayed no smaller than 12px x 12px; therefore this is set as a minimum measurement within the token's values. The result of this restriction can be seen in the Size tokens table. Following the ramp, HD should be 10px. However, the minimum size fixes it at 12px.
 
-The size of an icon can be changed within a density using the [Scale](/salt/foundations/scale) Foundation. For HD, the scale is based on the expected value rather than the minimum. This means an HD icon starts at 12px. When scaled up (x2 its default size) it will be 20px rather than 24px, at x3 its default it will be 30px, etc.
+The size of an icon can be changed within a density using the [Scale](./scale) Foundation. For HD, the scale is based on the expected value rather than the minimum. This means an HD icon starts at 12px. When scaled up (x2 its default size) it will be 20px rather than 24px, at x3 its default it will be 30px, etc.
 
 The Scale Foundation provides an example of `--salt-size-icon` scaling, including specific values for each density.
 
-You can find out more about icons and how to use them in the [Iconography](/salt/foundations/iconography) Foundation.
+You can find out more about icons and how to use them in the [Iconography](./iconography) Foundation.
 
 <ImageSwitcher
   images={[
diff --git a/site/docs/foundations/spacing.mdx b/site/docs/foundations/spacing.mdx
index 330a94d4f88..06a20c3a3b2 100644
--- a/site/docs/foundations/spacing.mdx
+++ b/site/docs/foundations/spacing.mdx
@@ -5,7 +5,7 @@ layout: DetailTechnical
 
 The organization of space is a key aspect of design. Spatial tokens help align layouts and create consistent visual rhythm.
 
-The spacing system is structured around a base unit (`--salt-spacing-100`) for each [density](/salt/foundations/density). This token determines the scale used across the design system.
+The spacing system is structured around a base unit (`--salt-spacing-100`) for each [density](./density). This token determines the scale used across the design system.
 
 Every space token within the system is a multiple of `--salt-spacing-100`. The numerical suffix indicates the percentage of the base unit each token represents. The scale is proportional across all densities.
 
@@ -126,6 +126,6 @@ For spacing purposes, separators are considered to be a type of content and ther
 
 Only use separators if the content cannot be effectively divided in another way. Too many repeating lines can overload a design and create unnecessary visual noise.
 
-The [Division](/salt/foundations/division) Foundation provides further guidance on the use of separators and their alternatives.
+The [Division](./division) Foundation provides further guidance on the use of separators and their alternatives.
 
 :fragment{src="./fragments/feedback.mdx"}
diff --git a/site/docs/foundations/typography.mdx b/site/docs/foundations/typography.mdx
index e6f34aee516..c27d2e3c88e 100644
--- a/site/docs/foundations/typography.mdx
+++ b/site/docs/foundations/typography.mdx
@@ -149,7 +149,7 @@ WCAG 2.0 requires that the contrast ratio between text and background is at leas
 
 ## Line height
 
-As with most aspects of the design system, type conforms to [density](density). Each style grows proportionately to align with the elements. Line height and the spaces between blocks also adhere to density.
+As with most aspects of the design system, type conforms to [density](./density). Each style grows proportionately to align with the elements. Line height and the spaces between blocks also adhere to density.
 
 Line height controls the space between baselines within a text. The height of a line of text is proportional to the text size.