diff --git a/packages/components/src/card/card-body/README.md b/packages/components/src/card/card-body/README.md
index f0d95287aed78a..73b450f7604d83 100644
--- a/packages/components/src/card/card-body/README.md
+++ b/packages/components/src/card/card-body/README.md
@@ -32,4 +32,4 @@ Determines the amount of padding within the component.
 -   Required: No
 -   Default: `medium`
 
-Note: This component is connected to [`<Card />`'s Context](../README.md#context). Passing props directly to this component will override the props derived from context.
+Note: This component is connected to [`<Card />`'s Context](../card/README.md#context). Passing props directly to this component will override the props derived from context.
diff --git a/packages/components/src/card/card-divider/README.md b/packages/components/src/card/card-divider/README.md
index feac94af529568..05dd2207a38e39 100644
--- a/packages/components/src/card/card-divider/README.md
+++ b/packages/components/src/card/card-divider/README.md
@@ -1,6 +1,6 @@
 # CardDivider
 
-CardDivider renders an optional divider within a [`<Card />`](../).
+CardDivider renders an optional divider within a [`<Card />`](../card/README.md).
 
 ## Usage
 
diff --git a/packages/components/src/card/card-footer/README.md b/packages/components/src/card/card-footer/README.md
index 22745bff7f27e5..0a350c6f2c0b11 100644
--- a/packages/components/src/card/card-footer/README.md
+++ b/packages/components/src/card/card-footer/README.md
@@ -1,6 +1,6 @@
 # CardFooter
 
-CardFooter renders an optional footer within a [`<Card />`](../).
+CardFooter renders an optional footer within a [`<Card />`](../card/README.md).
 
 ## Usage
 
@@ -16,7 +16,7 @@ const Example = () => (
 
 ### Flex
 
-Underneath, CardFooter uses the layout component [`<Flex/>`](../../flex/README.md). This improves the alignment of child items within the component.
+Underneath, CardFooter uses the layout component [`<Flex/>`](../../flex/flex/README.md). This improves the alignment of child items within the component.
 
 ```jsx
 import {
@@ -39,7 +39,7 @@ const Example = () => (
 );
 ```
 
-Check out [the documentation](../../flex/README.md) on `<Flex/>` for more details on layout composition.
+Check out [the documentation](../../flex/flex/README.md) on `<Flex/>` for more details on layout composition.
 
 ## Props
 
@@ -75,4 +75,4 @@ Determines the amount of padding within the component.
 -   Required: No
 -   Default: `medium`
 
-Note: This component is connected to [`<Card />`'s Context](../README.md#context). Passing props directly to this component will override the props derived from context.
+Note: This component is connected to [`<Card />`'s Context](../card/README.md#context). Passing props directly to this component will override the props derived from context.
diff --git a/packages/components/src/card/card-header/README.md b/packages/components/src/card/card-header/README.md
index b3597d0376aaa5..911c8fb2892bf2 100644
--- a/packages/components/src/card/card-header/README.md
+++ b/packages/components/src/card/card-header/README.md
@@ -1,6 +1,6 @@
 # CardHeader
 
-CardHeader renders an optional header within a [`<Card />`](../).
+CardHeader renders an optional header within a [`<Card />`](../card/README.md).
 
 ## Usage
 
@@ -16,7 +16,7 @@ const Example = () => (
 
 ### Flex
 
-Underneath, CardHeader uses the layout component [`<Flex/>`](../../flex/README.md). This improves the alignment of child items within the component.
+Underneath, CardHeader uses the layout component [`<Flex/>`](../../flex/flex/README.md). This improves the alignment of child items within the component.
 
 ```jsx
 import {
@@ -39,7 +39,7 @@ const Example = () => (
 );
 ```
 
-Check out [the documentation](../../flex/README.md) on `<Flex/>` for more details on layout composition.
+Check out [the documentation](../../flex/flex/README.md) on `<Flex/>` for more details on layout composition.
 
 ## Props
 
@@ -75,4 +75,4 @@ Determines the amount of padding within the component.
 -   Required: No
 -   Default: `medium`
 
-Note: This component is connected to [`<Card />`'s Context](../README.md#context). Passing props directly to this component will override the props derived from context.
+Note: This component is connected to [`<Card />`'s Context](../card/README.md#context). Passing props directly to this component will override the props derived from context.
diff --git a/packages/components/src/card/card-media/README.md b/packages/components/src/card/card-media/README.md
index 980e32127792ec..a93fd81ff8a68e 100644
--- a/packages/components/src/card/card-media/README.md
+++ b/packages/components/src/card/card-media/README.md
@@ -1,6 +1,6 @@
 # CardMedia
 
-CardMedia provides a container for media elements, and renders within a [`<Card />`](../).
+CardMedia provides a container for media elements, and renders within a [`<Card />`](../card/README.md).
 
 ## Usage
 
diff --git a/packages/components/src/card/card/README.md b/packages/components/src/card/card/README.md
index c2738917028494..6a755a167eb229 100644
--- a/packages/components/src/card/card/README.md
+++ b/packages/components/src/card/card/README.md
@@ -44,11 +44,11 @@ Determines the amount of padding within the component.
 
 This component provides a collection of sub-component that can be used to compose various interfaces.
 
--   [`<CardBody />`](./docs/body.md)
--   [`<CardDivider />`](./docs/divider.md)
--   [`<CardFooter />`](./docs/footer.md)
--   [`<CardHeader />`](./docs/header.md)
--   [`<CardMedia />`](./docs/media.md)
+-   [`<CardBody />`](../card-body/README.md)
+-   [`<CardDivider />`](../card-divider/README.md)
+-   [`<CardFooter />`](../card-footer/README.md)
+-   [`<CardHeader />`](../card-header/README.md)
+-   [`<CardMedia />`](../card-media/README.md)
 
 ### Sub-Components Example