diff --git a/projects/novo-elements/src/elements/data-table/data-table.component.ts b/projects/novo-elements/src/elements/data-table/data-table.component.ts
index 57f57e123..c287ce229 100644
--- a/projects/novo-elements/src/elements/data-table/data-table.component.ts
+++ b/projects/novo-elements/src/elements/data-table/data-table.component.ts
@@ -297,6 +297,7 @@ import { DataTableState } from './state/data-table-state.service';
         [loading]="paginationOptions.loading"
         [errorLoading]="paginationOptions.errorLoading"
         [paginationRefreshSubject]="paginationRefreshSubject"
+        [showPaginationTotalRecordCount]="true"
       >
       </novo-data-table-pagination>
     </footer>
diff --git a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.scss b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.scss
index da245dbcc..561bed10b 100644
--- a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.scss
+++ b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.scss
@@ -120,5 +120,9 @@ $breakpoint: 1000px;
         opacity: 1;
       }
     }
+    .novo-data-table-of-total-amount {
+      color: $slate;
+      font-size: 12px;
+    }
   }
 }
diff --git a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts
index 28b41136c..3dd37452a 100644
--- a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts
+++ b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts
@@ -76,6 +76,9 @@ const MAX_PAGES_DISPLAYED = 5;
         [attr.data-feature-id]="dataFeatureId"
       >
       </novo-select>
+      <div *ngIf="showPaginationTotalRecordCount && !loading && !errorLoading" class="novo-data-table-of-total-amount" data-automation-id="novo-data-table-of-total-amount">
+        {{ labels.ofXAmount(length) }}
+      </div>
       <span class="spacer"></span>
       <ul *ngIf="!loading && !errorLoading" class="pager" data-automation-id="pager">
         <li class="page" (click)="selectPage(page - 1)" [ngClass]="{ disabled: page === 0 }">
@@ -150,6 +153,8 @@ export class NovoDataTablePagination<T> implements OnInit, OnDestroy {
   public errorLoading: boolean = false;
   @Input()
   public paginationRefreshSubject = new Subject<void>();
+  @Input()
+  public showPaginationTotalRecordCount: boolean = false;
 
   @Input()
   get length(): number {
diff --git a/projects/novo-elements/src/services/novo-label-service.ts b/projects/novo-elements/src/services/novo-label-service.ts
index 757c7a922..eb5dc7f5f 100644
--- a/projects/novo-elements/src/services/novo-label-service.ts
+++ b/projects/novo-elements/src/services/novo-label-service.ts
@@ -182,6 +182,10 @@ export class NovoLabelService {
     return `Showing ${shown} of ${total} Results.`;
   }
 
+  ofXAmount(amount: number) {
+    return `of ${amount}`;
+  }
+
   totalRecords(total: number, select = false) {
     return select ? `Select all ${total} records.` : `De-select remaining ${total} records.`;
   }
diff --git a/projects/novo-examples/src/examples.routes.ts b/projects/novo-examples/src/examples.routes.ts
index 03e271c21..89beb4454 100644
--- a/projects/novo-examples/src/examples.routes.ts
+++ b/projects/novo-examples/src/examples.routes.ts
@@ -877,6 +877,9 @@ export class ButtonDevelopPage {
 <h2>Loading</h2>
 <p>Buttons can display a loading state when given the &quot;loading&quot; parameter. When loading is true the button will be disabled and get a loading spinner.</p>
 <p><code-example example="button-loading"></code-example></p>
+<h2>Two Icons</h2>
+<p>A second icon can be specified, and it will take the opposite side of the primary icon.</p>
+<p><code-example example="button-two-icon"></code-example></p>
 `,
   host: { class: 'markdown-page' }
 })