diff --git a/ui/app/controllers/vault/cluster/secrets/backend/list.js b/ui/app/controllers/vault/cluster/secrets/backend/list.js
index bb0d070793..344fd2167b 100644
--- a/ui/app/controllers/vault/cluster/secrets/backend/list.js
+++ b/ui/app/controllers/vault/cluster/secrets/backend/list.js
@@ -10,6 +10,7 @@ import Controller from '@ember/controller';
 import BackendCrumbMixin from 'vault/mixins/backend-crumb';
 import ListController from 'core/mixins/list-controller';
 import { keyIsFolder } from 'core/utils/key-utils';
+import engineDisplayData from 'vault/helpers/engines-display-data';
 
 export default Controller.extend(ListController, BackendCrumbMixin, {
   flashMessages: service(),
@@ -17,6 +18,11 @@ export default Controller.extend(ListController, BackendCrumbMixin, {
 
   tab: '',
 
+  // Check if the current engine is an old engine - for showing old UI designs
+  get isOldEngine() {
+    return engineDisplayData(this.backendType)?.isOldEngine;
+  },
+
   // callback from HDS pagination to set the queryParams page
   get paginationQueryParams() {
     return (page) => {
diff --git a/ui/app/templates/vault/cluster/secrets/backend/list.hbs b/ui/app/templates/vault/cluster/secrets/backend/list.hbs
index 58a00e73f4..265c3f0e40 100644
--- a/ui/app/templates/vault/cluster/secrets/backend/list.hbs
+++ b/ui/app/templates/vault/cluster/secrets/backend/list.hbs
@@ -39,21 +39,46 @@
         {{/if}}
       </ToolbarFilters>
 
-      <ToolbarActions>
-        <ToolbarSecretLink
-          @secret=""
-          @mode="create"
-          @backend={{this.backendModel.id}}
-          @type="add"
-          @queryParams={{hash initialKey=(or this.filter this.baseKey.id) itemType=this.tab}}
-          data-test-create-secret-link
-        >
-          {{options.create}}
-        </ToolbarSecretLink>
-      </ToolbarActions>
+      {{! Old Engines will keep the existing toolbar actions }}
+      {{#if this.isOldEngine}}
+        <ToolbarActions>
+          <ToolbarSecretLink
+            @secret=""
+            @mode="create"
+            @backend={{this.backendModel.id}}
+            @type="add"
+            @queryParams={{hash initialKey=(or this.filter this.baseKey.id) itemType=this.tab}}
+            data-test-create-secret-link
+          >
+            {{options.create}}
+          </ToolbarSecretLink>
+        </ToolbarActions>
+      {{/if}}
     </Toolbar>
   {{/if}}
 
+  {{! Display CTA buttons if isOldEngine flag is not set }}
+  {{#unless this.isOldEngine}}
+    <div class="flex column-gap-16 top-right-absolute has-top-margin-s">
+      {{! TODO: Hook dropdown actions to the appropriate routes & actions }}
+      <Hds::Dropdown as |D|>
+        <D.ToggleButton @text="Manage" @color="secondary" data-test-manage-dropdown />
+        <D.Interactive @icon="settings" @route="vault.cluster.secrets.backend.configuration.index">Configure</D.Interactive>
+        <D.Interactive {{on "click" D.close}} @color="critical" @icon="trash">Delete</D.Interactive>
+      </Hds::Dropdown>
+
+      <Hds::Button
+        @text={{options.create}}
+        @icon="plus"
+        {{! This route would be set in secret-link.js but we're using an HDS button instead of the ToolbarSecretLink wrapper so we're explicitly setting it here  }}
+        @route="vault.cluster.secrets.backend.create-root"
+        @query={{hash initialKey=(or this.filter this.baseKey.id) itemType=this.tab}}
+        {{! TODO: rename this test identifier when updating tests }}
+        data-test-create-secret-link
+      />
+    </div>
+  {{/unless}}
+
   {{#if this.model.meta.total}}
     {{#each this.model as |item|}}
       {{! Because of the component helper cannot use glimmer nested SecretList::Item }}