diff --git a/addons/api/mirage/config.js b/addons/api/mirage/config.js
index 008ed2743..1b495c0b2 100644
--- a/addons/api/mirage/config.js
+++ b/addons/api/mirage/config.js
@@ -456,6 +456,14 @@ export default function () {
     return new Response(200);
   });
 
+  // credential-stores
+
+  this.get(
+    '/credential-stores',
+    ({ credentialStores }, { queryParams: { scope_id: scopeId } }) =>
+      credentialStores.where({ scopeId })
+  );
+
   /* Uncomment the following line and the Response import above
    * Then change the response code to simulate error responses.
    * this.get('/scopes', () => new Response(505));
diff --git a/addons/core/translations/resources/en-us.yaml b/addons/core/translations/resources/en-us.yaml
index f6b2b4a3c..2c9712a67 100644
--- a/addons/core/translations/resources/en-us.yaml
+++ b/addons/core/translations/resources/en-us.yaml
@@ -267,3 +267,7 @@ target:
       add:
         title: Add Host Sets
         description: Select host sets to assign to this target.
+credential-store:
+  title: Credential Store
+  title_plural: Credential Stores
+  description: A credential stores is a collection of credentials and credential libraries.
diff --git a/ui/admin/app/router.js b/ui/admin/app/router.js
index c63c9a627..34a33eae1 100644
--- a/ui/admin/app/router.js
+++ b/ui/admin/app/router.js
@@ -86,6 +86,7 @@ Router.map(function () {
           });
         });
       });
+      this.route('credential-stores', function () {});
     });
   });
 
diff --git a/ui/admin/app/routes/scopes/scope/credential-stores.js b/ui/admin/app/routes/scopes/scope/credential-stores.js
new file mode 100644
index 000000000..7f75dd4fa
--- /dev/null
+++ b/ui/admin/app/routes/scopes/scope/credential-stores.js
@@ -0,0 +1,12 @@
+import Route from '@ember/routing/route';
+
+export default class ScopesScopeCredentialStoresRoute extends Route {
+  /**
+   * Load all credential stores under current scope
+   * @returns {Promise[CredentialStoreModel]}
+   */
+  async model() {
+    const { id: scope_id } = this.modelFor('scopes.scope');
+    return this.store.query('credential-store', { scope_id });
+  }
+}
diff --git a/ui/admin/app/routes/scopes/scope/credential-stores/index.js b/ui/admin/app/routes/scopes/scope/credential-stores/index.js
new file mode 100644
index 000000000..99ced4658
--- /dev/null
+++ b/ui/admin/app/routes/scopes/scope/credential-stores/index.js
@@ -0,0 +1,3 @@
+import Route from '@ember/routing/route';
+
+export default class ScopesScopeCredentialStoresIndexRoute extends Route {}
diff --git a/ui/admin/app/templates/scopes/scope.hbs b/ui/admin/app/templates/scopes/scope.hbs
index b25624cb9..b0040f3e7 100644
--- a/ui/admin/app/templates/scopes/scope.hbs
+++ b/ui/admin/app/templates/scopes/scope.hbs
@@ -83,6 +83,12 @@
             <Rose::Icon @name='app-icons/host-catalogs' @size='medium' />
             {{t 'resources.host-catalog.title_plural'}}
           </nav.link>
+          {{#if (feature-flag 'credential-store')}}
+            <nav.link @route='scopes.scope.credential-stores'>
+              <Rose::Icon @name='app-icons/credential' @size='medium' />
+              {{t 'resources.credential-store.title_plural'}}
+            </nav.link>
+          {{/if}}
         </Rose::Nav::Sidebar>
       {{/if}}
 
diff --git a/ui/admin/app/templates/scopes/scope/credential-stores.hbs b/ui/admin/app/templates/scopes/scope/credential-stores.hbs
new file mode 100644
index 000000000..27b461c70
--- /dev/null
+++ b/ui/admin/app/templates/scopes/scope/credential-stores.hbs
@@ -0,0 +1,50 @@
+<Rose::Layout::Page as |page|>
+  {{! <page.breadcrumbs>
+    <BreadCrumbs />
+  </page.breadcrumbs> }}
+
+  <page.header>
+    <h2>
+      {{t 'resources.credential-store.title_plural'}}
+    </h2>
+    {{t 'resources.credential-store.description'}}
+  </page.header>
+
+  {{!-- <page.actions>
+    {{#if @model}}
+      <Rose::LinkButton
+        @route='scopes.scope.credential-stores.new'
+        @style='primary'
+      >
+        {{t 'titles.new'}}
+      </Rose::LinkButton>
+    {{/if}}
+  </page.actions> --}}
+
+  <page.body>
+    {{#if @model}}
+      <Rose::Table as |table|>
+        <table.header as |header|>
+          <header.row as |row|>
+            <row.headerCell>{{t 'form.name.label'}}</row.headerCell>
+            <row.headerCell>{{t 'form.type.label'}}</row.headerCell>
+            <row.headerCell>{{t 'form.id.label'}}</row.headerCell>
+          </header.row>
+        </table.header>
+
+        <table.body as |body|>
+          {{#each @model as |credentialStore|}}
+            <body.row as |row|>
+              <row.headerCell>
+                {{credentialStore.displayName}}
+                <p>{{credentialStore.description}}</p>
+              </row.headerCell>
+              <row.cell>{{credentialStore.type}}</row.cell>
+              <row.cell>{{credentialStore.id}}</row.cell>
+            </body.row>
+          {{/each}}
+        </table.body>
+      </Rose::Table>
+    {{/if}}
+  </page.body>
+</Rose::Layout::Page>
\ No newline at end of file
diff --git a/ui/admin/app/templates/scopes/scope/credential-stores/index.hbs b/ui/admin/app/templates/scopes/scope/credential-stores/index.hbs
new file mode 100644
index 000000000..a3fb15862
--- /dev/null
+++ b/ui/admin/app/templates/scopes/scope/credential-stores/index.hbs
@@ -0,0 +1,2 @@
+{{page-title 'Index'}}
+{{outlet}}
\ No newline at end of file
diff --git a/ui/admin/tests/unit/routes/scopes/scope/credential-stores-test.js b/ui/admin/tests/unit/routes/scopes/scope/credential-stores-test.js
new file mode 100644
index 000000000..002668809
--- /dev/null
+++ b/ui/admin/tests/unit/routes/scopes/scope/credential-stores-test.js
@@ -0,0 +1,11 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Route | scopes/scope/credential-stores', function (hooks) {
+  setupTest(hooks);
+
+  test('it exists', function (assert) {
+    let route = this.owner.lookup('route:scopes/scope/credential-stores');
+    assert.ok(route);
+  });
+});
diff --git a/ui/admin/tests/unit/routes/scopes/scope/credential-stores/index-test.js b/ui/admin/tests/unit/routes/scopes/scope/credential-stores/index-test.js
new file mode 100644
index 000000000..6bc2ed3c6
--- /dev/null
+++ b/ui/admin/tests/unit/routes/scopes/scope/credential-stores/index-test.js
@@ -0,0 +1,11 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Route | scopes/scope/credential-stores/index', function (hooks) {
+  setupTest(hooks);
+
+  test('it exists', function (assert) {
+    let route = this.owner.lookup('route:scopes/scope/credential-stores/index');
+    assert.ok(route);
+  });
+});