diff --git a/app/assets/icons/icon-check.svg b/app/assets/icons/icon-check.svg
index f14e2bf..1bf40a3 100644
--- a/app/assets/icons/icon-check.svg
+++ b/app/assets/icons/icon-check.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 12"><path d="M14 2.2L12.2.5 4.7 8 1.8 5.1 0 6.9l4.7 4.6z"/></svg>
\ No newline at end of file
+<svg viewBox="0 0 17.75 17.75"><path d="M7 14.5L2 9.54l1.59-1.57L7 11.35 14.41 4 16 5.58 7 14.5z"/><path fill="none" d="M-7-7h32v32H-7z"/></svg>
\ No newline at end of file
diff --git a/app/assets/icons/icon-chevron-right.svg b/app/assets/icons/icon-chevron-right.svg
index 7c48325..a509934 100644
--- a/app/assets/icons/icon-chevron-right.svg
+++ b/app/assets/icons/icon-chevron-right.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path d="M11 8l-5 5-.7-.7L9.6 8 5.3 3.7 6 3z"></path></svg>
\ No newline at end of file
+<svg viewBox="0 0 32 32"><path d="M22 16L12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"/><path fill="none" d="M0 0h32v32H0z"/></svg>
diff --git a/app/common/components/table/table.html b/app/common/components/table/table.html
index b40c346..ceedd91 100644
--- a/app/common/components/table/table.html
+++ b/app/common/components/table/table.html
@@ -1,4 +1,4 @@
-<table class="bmc-table">
+<table class="bmc-table {{$ctrl.size}}">
   <thead>
     <!-- Header row -->
     <tr>
@@ -14,9 +14,9 @@
         ng-repeat="row in $ctrl.model.data"
         class="bmc-table__row">
       <!-- Row item -->
-      <td ng-repeat="item in row.uiData"
+      <td ng-repeat="item in row.uiData track by $index"
           class="bmc-table__cell">
-        {{item}}
+          <ng-bind-html ng-bind-html="item"></ng-bind-html>
       </td>
       <!-- Row Actions -->
       <td ng-if="$ctrl.rowActionsEnabled"
diff --git a/app/common/components/table/table.js b/app/common/components/table/table.js
index 09a6d6d..cf2b797 100644
--- a/app/common/components/table/table.js
+++ b/app/common/components/table/table.js
@@ -9,13 +9,16 @@
    * The <bmc-table> component expects a 'model' attribute
    * that will contain all the data needed to render the table.
    *
-   * The component also accepts a 'row-actions-enabled' attribute,
+   * The component accepts a 'row-actions-enabled' attribute,
    * to optionally render table row actions. Defaults to false.
    * Pass true to render actions. Row actions are defined in
    * model.data.actions.
    *
+   * The component accepts a 'size' attribute which can be
+   * set to 'small' which will render a smaller font size in the
+   * table.
    *
-   * The model object should contain 'header', and 'data'
+   * The model object should contain 'header' and 'data'
    * properties.
    *
    * model: {
@@ -96,6 +99,6 @@
   angular.module('app.common.components').component('bmcTable', {
     template: require('./table.html'),
     controller: TableController,
-    bindings: {model: '<', rowActionsEnabled: '<', emitAction: '&'}
+    bindings: {model: '<', rowActionsEnabled: '<', size: '<', emitAction: '&'}
   })
 })(window.angular);
diff --git a/app/common/styles/components/table.scss b/app/common/styles/components/table.scss
index 40b6a64..0cdb414 100644
--- a/app/common/styles/components/table.scss
+++ b/app/common/styles/components/table.scss
@@ -149,6 +149,9 @@
 
 .bmc-table {
   width: 100%;
+  &.small {
+    font-size: 90%;
+  }
 }
 
 .bmc-table__row {
diff --git a/app/common/styles/elements/accordion.scss b/app/common/styles/elements/accordion.scss
index 6f4c62e..5923505 100644
--- a/app/common/styles/elements/accordion.scss
+++ b/app/common/styles/elements/accordion.scss
@@ -49,4 +49,15 @@
     max-height: 1000px;
     @include fastTransition-all;
   }
+}
+
+.accordion-trigger {
+  .icon {
+    transition: transform $duration--fast-01;
+  }
+  &.accordion-trigger--expanded {
+    .icon {
+      transform: rotate(90deg);
+    }
+  }
 }
\ No newline at end of file
diff --git a/app/index.js b/app/index.js
index c839708..6673c29 100644
--- a/app/index.js
+++ b/app/index.js
@@ -104,6 +104,7 @@
 import users_index from './users/index.js';
 import user_accounts_controller from './users/controllers/user-accounts-controller.js';
 import username_validator from './users/directives/username-validator.js';
+import role_table from './users/directives/role-table.js';
 
 window.angular && (function(angular) {
   'use strict';
diff --git a/app/users/controllers/user-accounts-controller.html b/app/users/controllers/user-accounts-controller.html
index 41094b8..76df616 100644
--- a/app/users/controllers/user-accounts-controller.html
+++ b/app/users/controllers/user-accounts-controller.html
@@ -1,5 +1,5 @@
 <loader loading="loading"></loader>
-<div class="local-users">
+<div class="page local-users">
   <div class="row column">
     <div class="column small-12">
       <h1 class="page-title">Local user management</h1>
@@ -21,6 +21,7 @@
           Add user
         </button>
       </div>
+      <!-- Local user table -->
       <bmc-table
         model="tableModel"
         row-actions-enabled="true"
@@ -29,4 +30,10 @@
       </bmc-table>
     </div>
   </div>
-</div>
\ No newline at end of file
+  <div class="row column">
+    <div class="column small-12">
+      <!-- Role table -->
+      <role-table></role-table>
+    </div>
+  </div>
+</div>
diff --git a/app/users/directives/role-table.html b/app/users/directives/role-table.html
new file mode 100644
index 0000000..55e8108
--- /dev/null
+++ b/app/users/directives/role-table.html
@@ -0,0 +1,14 @@
+<div class="role-table">
+  <button class="btn btn-tertiary accordion-trigger"
+          ng-click="roleTableCtrl.onClick()"
+          ng-class="{'accordion-trigger--expanded' : !roleTableCtrl.isCollapsed}">
+    <icon file="icon-chevron-right.svg" aria-hidden="true"></icon>
+    <span ng-if="roleTableCtrl.isCollapsed">View privilege role descriptions</span>
+    <span ng-if="!roleTableCtrl.isCollapsed">Hide privilege role descriptions</span>
+  </button>
+  <div uib-collapse="roleTableCtrl.isCollapsed">
+    <bmc-table  model="roleTableCtrl.tableModel"
+                size="'small'">
+    </bmc-table>
+  </div>
+</div>
\ No newline at end of file
diff --git a/app/users/directives/role-table.js b/app/users/directives/role-table.js
new file mode 100644
index 0000000..c72ccfc
--- /dev/null
+++ b/app/users/directives/role-table.js
@@ -0,0 +1,65 @@
+window.angular && (function(angular) {
+  'use strict';
+
+  /**
+   * Role table
+   * Table of privilege role descriptions
+   */
+  angular.module('app.users').directive('roleTable', [
+    '$sce',
+    function($sce) {
+      return {
+        restrict: 'E',
+        template: require('./role-table.html'),
+        controllerAs: 'roleTableCtrl',
+        controller: function() {
+          // TODO: This is a workaround to render the checkmark svg icon
+          // Would eventually like to enhance <bmc-table> component to
+          // compile custom directives as table items
+          const svg = require('../../assets/icons/icon-check.svg');
+          const check =
+              $sce.trustAsHtml(`<span class="icon__check-mark">${svg}<span>`);
+
+          this.tableModel = {};
+          this.tableModel.header =
+              ['', 'Admin', 'Operator', 'User', 'Callback'];
+
+          // TODO: When API changed from D-Bus to Redfish, 'Operator' role
+          // should have 'Configure components managed by this service'
+          // privilege checked
+          this.tableModel.data = [
+            {
+              uiData: [
+                'Configure components managed by this service', check, '', '',
+                ''
+              ]
+            },
+            {uiData: ['Configure manager resources', check, '', '', '']},
+            {
+              uiData: [
+                'Update password for current user account', check, check, check,
+                ''
+              ]
+            },
+            {uiData: ['Configure users and their accounts', check, '', '', '']},
+            {
+              uiData: [
+                'Log in to the service and read resources', check, check, check,
+                ''
+              ]
+            },
+            {uiData: ['IPMI access point', check, check, check, check]},
+            {uiData: ['Redfish access point', check, check, check, '']},
+            {uiData: ['SSH access point', check, check, check, '']},
+            {uiData: ['WebUI access point', check, check, check, '']},
+          ];
+
+          this.isCollapsed = true;
+          this.onClick = () => {
+            this.isCollapsed = !this.isCollapsed;
+          };
+        }
+      };
+    }
+  ]);
+})(window.angular);
diff --git a/app/users/styles/user-accounts.scss b/app/users/styles/user-accounts.scss
index 9658b90..fe580cd 100644
--- a/app/users/styles/user-accounts.scss
+++ b/app/users/styles/user-accounts.scss
@@ -1,3 +1,7 @@
+.local-users {
+  margin-bottom: 50px;
+}
+
 .local-users__actions {
   display: flex;
   flex-direction: row;
@@ -29,3 +33,31 @@
     }
   }
 }
+
+.role-table {
+  margin-top: 30px;
+  .bmc-table {
+    max-width: 750px;
+  }
+  .bmc-table__cell:not(:first-of-type) {
+    text-align: center;
+  }
+  .bmc-table__column-header {
+    text-align: center;
+  }
+
+  // Bootstrap collapse directive override
+  // The expanded element gets 'in' class instead of 'show' class
+  // Bootstrap changes the display property for 'show' but not 'in'
+  .collapse.in {
+      display: block!important;
+  }
+}
+
+.icon__check-mark {
+  display: inline-block;
+  svg {
+    width: 16px;
+    fill: $primary-dark;
+  }
+}
\ No newline at end of file