diff --git a/packages/paste-website/src/pages/components/list/index.mdx b/packages/paste-website/src/pages/components/list/index.mdx
index d8372b6951..c8d0aecb6a 100644
--- a/packages/paste-website/src/pages/components/list/index.mdx
+++ b/packages/paste-website/src/pages/components/list/index.mdx
@@ -86,7 +86,7 @@ Lists are a number of connected list items that are printed consecutively, typic
- Lists should align with the font-size, font-weight, and line-height of paragraphs, but are styled with bullets or numbers.
- Lists can have similar children elements as paragraphs to provide emphasis on a certain word or phrase.
-### Ordered Display List vs Progress Steps
+### Progress Steps vs Ordered Display List vs Timeline
**Progress Steps**
@@ -97,6 +97,10 @@ Lists are a number of connected list items that are printed consecutively, typic
Ordered Display Lists structure tasks but don’t show progression or status through a multi-step task.
+**Timeline**
+
+- [Timeline](/components/timeline) displays the history or sequence of events, focusing on what has happened over time.
+- Use Timeline when user interaction is secondary, and progress does not depend on user actions since the process continues even without direct user input.
### Accessibility
- `ListItem`s should always have an `OrderedList` or `UnorderedList` parent component.
diff --git a/packages/paste-website/src/pages/components/progress-steps/index.mdx b/packages/paste-website/src/pages/components/progress-steps/index.mdx
index a7f202485d..4e77dac4d2 100644
--- a/packages/paste-website/src/pages/components/progress-steps/index.mdx
+++ b/packages/paste-website/src/pages/components/progress-steps/index.mdx
@@ -93,7 +93,7 @@ Each step can communicate one of these statuses:
- **Error**: The user has interacted with this step but more action is required that will prevent completing the full task.
- **Incomplete + Disabled**: This step is not yet reached by a user.
-### Ordered Display List vs Progress Steps
+### Progress Steps vs Ordered Display List vs Timeline
**Progress Steps**
@@ -104,6 +104,11 @@ Each step can communicate one of these statuses:
[Ordered Display Lists](/components/list#ordered-display-list) structure tasks but don’t show progression or status through a multi-step task.
+**Timeline**
+
+- [Timeline](/components/timeline) displays the history or sequence of events, focusing on what has happened over time.
+- Use Timeline when user interaction is secondary, and progress does not depend on user actions since the process continues even without direct user input.
+
### Accessibility
- Give each step a concise label describing what the goal of that step is.
@@ -237,28 +242,6 @@ Each step within the Progress Steps component has a label which can be set to ad
{i18nExample}
-
-### Timeline vs. Progress Steps
-
-Use Progress Steps:
-
-
- To guide users through a sequence of steps necessary to complete a task.
-
- When user interaction is required at certain points in a process and actions are necessary to complete a goal.
-
-
-
-Use Timeline:
-
-
- To display the history or sequence of events, focusing on what has happened over time.
-
- When user interaction is secondary, and progress does not depend on user actions, ensuring the process continues
- even without direct user input.
-
-
-
## Composition Notes
- Each step must have a label. Keep the label concise with fewer than 5 words per label.
diff --git a/packages/paste-website/src/pages/components/timeline/index.mdx b/packages/paste-website/src/pages/components/timeline/index.mdx
index f7100077ee..7f67f39df0 100644
--- a/packages/paste-website/src/pages/components/timeline/index.mdx
+++ b/packages/paste-website/src/pages/components/timeline/index.mdx
@@ -107,26 +107,22 @@ Timelines can be used in different use cases, such as tracking milestones, monit
-### Timeline vs. Progress Steps
+### Progress Steps vs Ordered Display List vs Timeline
-Use Timeline:
+**Progress Steps**
-
- To display the history or sequence of events, focusing on what has happened over time.
-
- When user interaction is secondary, and progress does not depend on user actions, ensuring the process continues
- even without direct user input.
-
-
+- [Progress Steps](/components/progress-steps) show users an outline of a complex multi-step task across multiple pages or apps.
+- Progress Steps convey progression and have interactive status states.
-Use Progress Steps:
+**Ordered Display List**
+
+[Ordered Display Lists](/components/list#ordered-display-list) structure tasks but don’t show progression or status through a multi-step task.
+
+**Timeline**
+
+- Timeline displays the history or sequence of events, focusing on what has happened over time.
+- Use Timeline when user interaction is secondary, and progress does not depend on user actions since the process continues even without direct user input.
-
- To guide users through a sequence of steps necessary to complete a task.
-
- When user interaction is required at certain points in a process and actions are necessary to complete a goal.
-
-
## Examples