diff --git a/changelog/24191.txt b/changelog/24191.txt
new file mode 100644
index 0000000000..2fe98e926d
--- /dev/null
+++ b/changelog/24191.txt
@@ -0,0 +1,3 @@
+```release-note:improvement
+ui: Implement Helios Design System footer component
+```
diff --git a/ui/app/styles/core.scss b/ui/app/styles/core.scss
index 92d50091f6..eefc125be3 100644
--- a/ui/app/styles/core.scss
+++ b/ui/app/styles/core.scss
@@ -30,7 +30,6 @@
 @import './core/control';
 @import './core/field';
 @import './core/file';
-@import './core/footer';
 @import './core/inputs';
 @import './core/json-diff-patch';
 @import './core/label';
diff --git a/ui/app/styles/core/footer.scss b/ui/app/styles/core/footer.scss
deleted file mode 100644
index c3a193c309..0000000000
--- a/ui/app/styles/core/footer.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-/**
- * Copyright (c) HashiCorp, Inc.
- * SPDX-License-Identifier: BUSL-1.1
- */
-
-.footer {
-  background-color: transparent;
-  border-top: $base-border;
-  padding: $spacing-24 $spacing-20;
-  margin-top: auto;
-
-  span:not(:first-child) {
-    display: inline-block;
-    padding: 0 0.5rem;
-
-    @include until($mobile) {
-      display: none;
-    }
-  }
-}
diff --git a/ui/app/templates/vault.hbs b/ui/app/templates/vault.hbs
index 0c3fd74bc2..3a72ea2d85 100644
--- a/ui/app/templates/vault.hbs
+++ b/ui/app/templates/vault.hbs
@@ -4,32 +4,23 @@
 ~}}
 
 {{outlet}}
-<footer class="footer has-text-grey has-text-centered">
-  <span class="is-inline-block">
-    <Icon @name="hashicorp" aria-hidden="true" class="has-text-grey-light" />
-    &copy;
-    {{date-format (now) "yyyy"}}
-    HashiCorp
-  </span>
-  <span>
-    <ExternalLink @href={{changelog-url-for this.auth.activeCluster.leaderNode.version}} class="link has-text-grey">
-      Vault
-      {{this.auth.activeCluster.leaderNode.version}}
-    </ExternalLink>
-  </span>
+
+<Hds::AppFooter as |AF|>
+  <AF.Link @href={{changelog-url-for this.auth.activeCluster.leaderNode.version}}>
+    Vault
+    {{this.auth.activeCluster.leaderNode.version}}
+  </AF.Link>
   {{#if (is-version "OSS")}}
-    <span>
-      <ExternalLink @href="https://hashicorp.com/products/vault/trial?source=vaultui" class="link has-text-grey">
-        Upgrade to Vault Enterprise
-      </ExternalLink>
-    </span>
+    <AF.Link @href="https://hashicorp.com/products/vault/trial?source=vaultui">
+      Upgrade to Vault Enterprise
+    </AF.Link>
   {{/if}}
-  <span>
-    <DocLink @path="/vault" class="has-text-grey">
-      Documentation
-    </DocLink>
-  </span>
-</footer>
+  <AF.Link @href={{doc-link "/vault"}}>
+    Documentation
+  </AF.Link>
+  <AF.LegalLinks />
+</Hds::AppFooter>
+
 {{#if (eq this.env "development")}}
   <div class="env-banner level development">
     <div class="level-item notification">