diff --git a/src/assets/styles/_form-components.scss b/src/assets/styles/_form-components.scss
index d9ae9d4..e7a7b0c 100644
--- a/src/assets/styles/_form-components.scss
+++ b/src/assets/styles/_form-components.scss
@@ -34,4 +34,4 @@
       color: $gray-700!important;
     }
   }
-}
+}
\ No newline at end of file
diff --git a/src/components/AppNavigation/AppNavigation.vue b/src/components/AppNavigation/AppNavigation.vue
index d0fee43..f2f049b 100644
--- a/src/components/AppNavigation/AppNavigation.vue
+++ b/src/components/AppNavigation/AppNavigation.vue
@@ -81,7 +81,7 @@
               <b-nav-item to="/access-control/local-user-management">
                 {{ $t('appNavigation.localUserManagement') }}
               </b-nav-item>
-              <b-nav-item href="javascript:void(0)">
+              <b-nav-item to="/access-control/ssl-certificates">
                 {{ $t('appNavigation.sslCertificates') }}
               </b-nav-item>
             </b-collapse>
diff --git a/src/locales/en-US.json b/src/locales/en-US.json
index 19b2082..d1d5f61 100644
--- a/src/locales/en-US.json
+++ b/src/locales/en-US.json
@@ -1,11 +1,13 @@
 {
   "global": {
     "action": {
+      "add": "Add",
       "confirm": "Confirm",
       "cancel": "Cancel",
       "delete": "Delete",
       "disable": "Disable",
       "enable": "Enable",
+      "replace": "Replace",
       "save": "Save",
       "selected": "Selected"
     },
@@ -17,6 +19,7 @@
       "invalidFormat": "Invalid format",
       "lengthMustBeBetween": "Length must be between %{min} – %{max} characters",
       "mustBeAtLeast": "Must be at least %{value}",
+      "required": "Required",
       "selectAnOption": "Select an option",
       "valueMustBeBetween": "Value must be between %{min} – %{max}"
     },
@@ -227,5 +230,33 @@
       "errorSaveSettings": "Error saving settings.",
       "successSaveSettings": "Successfully saved settings."
     }
+  },
+  "pageSslCertificates": {
+    "addNewCertificate": "Add new certificate",
+    "caCertificate": "CA Certificate",
+    "deleteCertificate": "Delete certificate",
+    "httpsCertificate": "HTTPS Certificate",
+    "ldapCertificate": "LDAP Certificate",
+    "replaceCertificate": "Replace certificate",
+    "modal": {
+      "certificateType": "Certificate type",
+      "certificateFile": "Certificate file",
+      "deleteConfirmMessage": "Are you sure you want to delete '%{certificate}' issued by %{issuedBy}? This action cannot be undone."
+    },
+    "table": {
+      "certificate": "Certificate",
+      "issuedBy": "Issued by",
+      "issuedTo": "Issued to",
+      "validFrom": "Valid from",
+      "validUntil": "Valid until"
+    },
+    "toast": {
+      "errorAddCertificate": "Error adding certificate.",
+      "errorDeleteCertificate": "Error deleting certificate.",
+      "errorReplaceCertificate": "Error replacing certificate.",
+      "successAddCertificate": "Successfully added %{certificate}.",
+      "successDeleteCertificate": "Successfully deleted %{certificate}.",
+      "successReplaceCertificate": "Successfully replaced %{certificate}."
+    }
   }
 }
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index ab1f296..17fc50f 100644
--- a/src/main.js
+++ b/src/main.js
@@ -10,6 +10,7 @@
   CollapsePlugin,
   FormPlugin,
   FormCheckboxPlugin,
+  FormFilePlugin,
   FormGroupPlugin,
   FormInputPlugin,
   FormRadioPlugin,
@@ -64,6 +65,7 @@
 Vue.use(CollapsePlugin);
 Vue.use(FormPlugin);
 Vue.use(FormCheckboxPlugin);
+Vue.use(FormFilePlugin);
 Vue.use(FormGroupPlugin);
 Vue.use(FormInputPlugin);
 Vue.use(FormRadioPlugin);
diff --git a/src/router/index.js b/src/router/index.js
index cd6cf8b..2af53ea 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -39,6 +39,14 @@
         }
       },
       {
+        path: '/access-control/ssl-certificates',
+        name: 'ssl-certificates',
+        component: () => import('@/views/AccessControl/SslCertificates'),
+        meta: {
+          title: 'appPageTitle.sslCertificates'
+        }
+      },
+      {
         path: '/control/reboot-bmc',
         name: 'reboot-bmc',
         component: () => import('@/views/Control/RebootBmc'),
diff --git a/src/store/api.js b/src/store/api.js
index 8fdbdd2..24a38e4 100644
--- a/src/store/api.js
+++ b/src/store/api.js
@@ -29,8 +29,8 @@
   delete(path, payload) {
     return api.delete(path, payload);
   },
-  post(path, payload) {
-    return api.post(path, payload);
+  post(path, payload, config) {
+    return api.post(path, payload, config);
   },
   patch(path, payload) {
     return api.patch(path, payload);
diff --git a/src/store/index.js b/src/store/index.js
index 08ada05..0180213 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -4,6 +4,7 @@
 import GlobalStore from './modules/GlobalStore';
 import AuthenticationStore from './modules/Authentication/AuthenticanStore';
 import LocalUserManagementStore from './modules/AccessControl/LocalUserMangementStore';
+import SslCertificatesStore from './modules/AccessControl/SslCertificatesStore';
 import OverviewStore from './modules/Overview/OverviewStore';
 import FirmwareStore from './modules/Configuration/FirmwareStore';
 import BootSettingsStore from './modules/Control/BootSettingsStore';
@@ -32,7 +33,8 @@
     powerControl: PowerControlStore,
     networkSettings: NetworkSettingStore,
     eventLog: EventLogStore,
-    sensors: SensorsStore
+    sensors: SensorsStore,
+    sslCertificates: SslCertificatesStore
   },
   plugins: [WebSocketPlugin]
 });
diff --git a/src/store/modules/AccessControl/SslCertificatesStore.js b/src/store/modules/AccessControl/SslCertificatesStore.js
new file mode 100644
index 0000000..e1758d3
--- /dev/null
+++ b/src/store/modules/AccessControl/SslCertificatesStore.js
@@ -0,0 +1,158 @@
+import api from '../../api';
+import i18n from '../../../i18n';
+
+const CERTIFICATE_TYPES = [
+  {
+    type: 'HTTPS Certificate',
+    location: '/redfish/v1/Managers/bmc/NetworkProtocol/HTTPS/Certificates/',
+    label: i18n.t('pageSslCertificates.httpsCertificate')
+  },
+  {
+    type: 'LDAP Certificate',
+    location: '/redfish/v1/AccountService/LDAP/Certificates/',
+    label: i18n.t('pageSslCertificates.ldapCertificate')
+  },
+  {
+    type: 'TrustStore Certificate',
+    location: '/redfish/v1/Managers/bmc/Truststore/Certificates/',
+    // Web UI will show 'CA Certificate' instead of
+    // 'TrustStore Certificate' after user testing revealed
+    // the term 'TrustStore Certificate' wasn't recognized/was unfamilar
+    label: i18n.t('pageSslCertificates.caCertificate')
+  }
+];
+
+const getCertificateProp = (type, prop) => {
+  const certificate = CERTIFICATE_TYPES.find(
+    certificate => certificate.type === type
+  );
+  return certificate ? certificate[prop] : null;
+};
+
+const SslCertificatesStore = {
+  namespaced: true,
+  state: {
+    allCertificates: [],
+    availableUploadTypes: []
+  },
+  getters: {
+    allCertificates: state => state.allCertificates,
+    availableUploadTypes: state => state.availableUploadTypes
+  },
+  mutations: {
+    setCertificates(state, certificates) {
+      state.allCertificates = certificates;
+    },
+    setAvailableUploadTypes(state, availableUploadTypes) {
+      state.availableUploadTypes = availableUploadTypes;
+    }
+  },
+  actions: {
+    getCertificates({ commit }) {
+      api
+        .get('/redfish/v1/CertificateService/CertificateLocations')
+        .then(({ data: { Links: { Certificates } } }) =>
+          Certificates.map(certificate => certificate['@odata.id'])
+        )
+        .then(certificateLocations => {
+          const promises = certificateLocations.map(location =>
+            api.get(location)
+          );
+          api.all(promises).then(
+            api.spread((...responses) => {
+              const certificates = responses.map(({ data }) => {
+                const {
+                  Name,
+                  ValidNotAfter,
+                  ValidNotBefore,
+                  Issuer = {},
+                  Subject = {}
+                } = data;
+                return {
+                  type: Name,
+                  location: data['@odata.id'],
+                  certificate: getCertificateProp(Name, 'label'),
+                  issuedBy: Issuer.CommonName,
+                  issuedTo: Subject.CommonName,
+                  validFrom: new Date(ValidNotBefore),
+                  validUntil: new Date(ValidNotAfter)
+                };
+              });
+              const availableUploadTypes = CERTIFICATE_TYPES.filter(
+                ({ type }) =>
+                  !certificates
+                    .map(certificate => certificate.type)
+                    .includes(type)
+              );
+
+              commit('setCertificates', certificates);
+              commit('setAvailableUploadTypes', availableUploadTypes);
+            })
+          );
+        });
+    },
+    async addNewCertificate({ dispatch }, { file, type }) {
+      return await api
+        .post(getCertificateProp(type, 'location'), file, {
+          headers: { 'Content-Type': 'application/x-pem-file' }
+        })
+        .then(() => dispatch('getCertificates'))
+        .then(() =>
+          i18n.t('pageSslCertificates.toast.successAddCertificate', {
+            certificate: getCertificateProp(type, 'label')
+          })
+        )
+        .catch(error => {
+          console.log(error);
+          throw new Error(
+            i18n.t('pageSslCertificates.toast.errorAddCertificate')
+          );
+        });
+    },
+    async replaceCertificate(
+      { dispatch },
+      { certificateString, location, type }
+    ) {
+      const data = {};
+      data.CertificateString = certificateString;
+      data.CertificateType = 'PEM';
+      data.CertificateUri = { '@odata.id': location };
+
+      return await api
+        .post(
+          '/redfish/v1/CertificateService/Actions/CertificateService.ReplaceCertificate',
+          data
+        )
+        .then(() => dispatch('getCertificates'))
+        .then(() =>
+          i18n.t('pageSslCertificates.toast.successReplaceCertificate', {
+            certificate: getCertificateProp(type, 'label')
+          })
+        )
+        .catch(error => {
+          console.log(error);
+          throw new Error(
+            i18n.t('pageSslCertificates.toast.errorReplaceCertificate')
+          );
+        });
+    },
+    async deleteCertificate({ dispatch }, { type, location }) {
+      return await api
+        .delete(location)
+        .then(() => dispatch('getCertificates'))
+        .then(() =>
+          i18n.t('pageSslCertificates.toast.successDeleteCertificate', {
+            certificate: getCertificateProp(type, 'label')
+          })
+        )
+        .catch(error => {
+          console.log(error);
+          throw new Error(
+            i18n.t('pageSslCertificates.toast.errorDeleteCertificate')
+          );
+        });
+    }
+  }
+};
+
+export default SslCertificatesStore;
diff --git a/src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue b/src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue
new file mode 100644
index 0000000..653a232
--- /dev/null
+++ b/src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue
@@ -0,0 +1,164 @@
+<template>
+  <b-modal id="upload-certificate" ref="modal" @ok="onOk" @hidden="resetForm">
+    <template v-slot:modal-title>
+      <template v-if="certificate">
+        {{ $t('pageSslCertificates.replaceCertificate') }}
+      </template>
+      <template v-else>
+        {{ $t('pageSslCertificates.addNewCertificate') }}
+      </template>
+    </template>
+    <b-form>
+      <!-- Replace Certificate type -->
+      <template v-if="certificate !== null">
+        <dl class="mb-4">
+          <dt>{{ $t('pageSslCertificates.modal.certificateType') }}</dt>
+          <dd>{{ certificate.certificate }}</dd>
+        </dl>
+      </template>
+
+      <!-- Add new Certificate type -->
+      <template v-else>
+        <b-form-group
+          :label="$t('pageSslCertificates.modal.certificateType')"
+          label-for="certificate-type"
+        >
+          <b-form-select
+            id="certificate-type"
+            v-model="form.certificateType"
+            :options="certificateOptions"
+            :state="getValidationState($v.form.certificateType)"
+            @input="$v.form.certificateType.$touch()"
+          >
+          </b-form-select>
+          <b-form-invalid-feedback role="alert">
+            <template v-if="!$v.form.certificateType.required">
+              {{ $t('global.form.fieldRequired') }}
+            </template>
+          </b-form-invalid-feedback>
+        </b-form-group>
+      </template>
+
+      <b-form-group
+        :label="$t('pageSslCertificates.modal.certificateFile')"
+        label-for="certificate-file"
+      >
+        <b-form-file
+          id="certificate-file"
+          v-model="form.file"
+          accept=".pem"
+          plain
+          :state="getValidationState($v.form.file)"
+        />
+        <b-form-invalid-feedback role="alert">
+          <template v-if="!$v.form.file.required">
+            {{ $t('global.form.required') }}
+          </template>
+        </b-form-invalid-feedback>
+      </b-form-group>
+    </b-form>
+    <template v-slot:modal-ok>
+      <template v-if="certificate">
+        {{ $t('global.action.replace') }}
+      </template>
+      <template v-else>
+        {{ $t('global.action.add') }}
+      </template>
+    </template>
+  </b-modal>
+</template>
+
+<script>
+import { required, requiredIf } from 'vuelidate/lib/validators';
+import VuelidateMixin from '../../../components/Mixins/VuelidateMixin.js';
+
+export default {
+  mixins: [VuelidateMixin],
+  props: {
+    certificate: {
+      type: Object,
+      default: null,
+      validator: prop => {
+        if (prop === null) return true;
+        return (
+          prop.hasOwnProperty('type') && prop.hasOwnProperty('certificate')
+        );
+      }
+    }
+  },
+  data() {
+    return {
+      form: {
+        certificateType: null,
+        file: null
+      }
+    };
+  },
+  computed: {
+    certificateTypes() {
+      return this.$store.getters['sslCertificates/availableUploadTypes'];
+    },
+    certificateOptions() {
+      return this.certificateTypes.map(({ type, label }) => {
+        return {
+          text: label,
+          value: type
+        };
+      });
+    }
+  },
+  watch: {
+    certificateOptions: function(options) {
+      if (options.length) {
+        this.form.certificateType = options[0].value;
+      }
+    }
+  },
+  validations() {
+    return {
+      form: {
+        certificateType: {
+          required: requiredIf(function() {
+            return !this.certificate;
+          })
+        },
+        file: {
+          required
+        }
+      }
+    };
+  },
+  methods: {
+    handleSubmit() {
+      this.$v.$touch();
+      if (this.$v.$invalid) return;
+      this.$emit('ok', {
+        addNew: !this.certificate,
+        file: this.form.file,
+        location: this.certificate ? this.certificate.location : null,
+        type: this.certificate
+          ? this.certificate.type
+          : this.form.certificateType
+      });
+      this.closeModal();
+    },
+    closeModal() {
+      this.$nextTick(() => {
+        this.$refs.modal.hide();
+      });
+    },
+    resetForm() {
+      this.form.certificateType = this.certificateOptions.length
+        ? this.certificateOptions[0].value
+        : null;
+      this.form.file = null;
+      this.$v.$reset();
+    },
+    onOk(bvModalEvt) {
+      // prevent modal close
+      bvModalEvt.preventDefault();
+      this.handleSubmit();
+    }
+  }
+};
+</script>
diff --git a/src/views/AccessControl/SslCertificates/SslCertificates.vue b/src/views/AccessControl/SslCertificates/SslCertificates.vue
new file mode 100644
index 0000000..ae28271
--- /dev/null
+++ b/src/views/AccessControl/SslCertificates/SslCertificates.vue
@@ -0,0 +1,209 @@
+<template>
+  <b-container fluid>
+    <page-title />
+    <b-row>
+      <b-col xl="9" class="text-right">
+        <b-button
+          variant="primary"
+          :disabled="certificatesForUpload.length === 0"
+          @click="initModalUploadCertificate(null)"
+        >
+          <icon-add />
+          {{ $t('pageSslCertificates.addNewCertificate') }}
+        </b-button>
+      </b-col>
+    </b-row>
+    <b-row>
+      <b-col xl="9">
+        <b-table :fields="fields" :items="tableItems">
+          <template v-slot:cell(validFrom)="{ value }">
+            {{ value | formatDate }}
+          </template>
+
+          <template v-slot:cell(validUntil)="{ value }">
+            {{ value | formatDate }}
+          </template>
+
+          <template v-slot:cell(actions)="{ value, item }">
+            <table-row-action
+              v-for="(action, index) in value"
+              :key="index"
+              :value="action.value"
+              :title="action.title"
+              :enabled="action.enabled"
+              @click:tableAction="onTableRowAction($event, item)"
+            >
+              <template v-slot:icon>
+                <icon-replace v-if="action.value === 'replace'" />
+                <icon-trashcan v-if="action.value === 'delete'" />
+              </template>
+            </table-row-action>
+          </template>
+        </b-table>
+      </b-col>
+    </b-row>
+
+    <!-- Modals -->
+    <modal-upload-certificate :certificate="modalCertificate" @ok="onModalOk" />
+  </b-container>
+</template>
+
+<script>
+import IconAdd from '@carbon/icons-vue/es/add--alt/20';
+import IconReplace from '@carbon/icons-vue/es/renew/20';
+import IconTrashcan from '@carbon/icons-vue/es/trash-can/20';
+
+import ModalUploadCertificate from './ModalUploadCertificate';
+import PageTitle from '../../../components/Global/PageTitle';
+import TableRowAction from '../../../components/Global/TableRowAction';
+
+import BVToastMixin from '../../../components/Mixins/BVToastMixin';
+
+export default {
+  name: 'SslCertificates',
+  components: {
+    IconAdd,
+    IconReplace,
+    IconTrashcan,
+    ModalUploadCertificate,
+    PageTitle,
+    TableRowAction
+  },
+  mixins: [BVToastMixin],
+  data() {
+    return {
+      modalCertificate: null,
+      fields: [
+        {
+          key: 'certificate',
+          label: this.$t('pageSslCertificates.table.certificate')
+        },
+        {
+          key: 'issuedBy',
+          label: this.$t('pageSslCertificates.table.issuedBy')
+        },
+        {
+          key: 'issuedTo',
+          label: this.$t('pageSslCertificates.table.issuedTo')
+        },
+        {
+          key: 'validFrom',
+          label: this.$t('pageSslCertificates.table.validFrom')
+        },
+        {
+          key: 'validUntil',
+          label: this.$t('pageSslCertificates.table.validUntil')
+        },
+        {
+          key: 'actions',
+          label: '',
+          tdClass: 'text-right'
+        }
+      ]
+    };
+  },
+  computed: {
+    certificates() {
+      return this.$store.getters['sslCertificates/allCertificates'];
+    },
+    tableItems() {
+      return this.certificates.map(certificate => {
+        return {
+          ...certificate,
+          actions: [
+            {
+              value: 'replace',
+              title: this.$t('pageSslCertificates.replaceCertificate')
+            },
+            {
+              value: 'delete',
+              title: this.$t('pageSslCertificates.deleteCertificate'),
+              enabled:
+                certificate.type === 'TrustStore Certificate' ? true : false
+            }
+          ]
+        };
+      });
+    },
+    certificatesForUpload() {
+      return this.$store.getters['sslCertificates/availableUploadTypes'];
+    }
+  },
+  created() {
+    this.$store.dispatch('sslCertificates/getCertificates');
+  },
+  methods: {
+    onTableRowAction(event, rowItem) {
+      switch (event) {
+        case 'replace':
+          this.initModalUploadCertificate(rowItem);
+          break;
+        case 'delete':
+          this.initModalDeleteCertificate(rowItem);
+          break;
+        default:
+          break;
+      }
+    },
+    initModalUploadCertificate(certificate = null) {
+      this.modalCertificate = certificate;
+      this.$bvModal.show('upload-certificate');
+    },
+    initModalDeleteCertificate(certificate) {
+      this.$bvModal
+        .msgBoxConfirm(
+          this.$t('pageSslCertificates.modal.deleteConfirmMessage', {
+            issuedBy: certificate.issuedBy,
+            certificate: certificate.certificate
+          }),
+          {
+            title: this.$t('pageSslCertificates.deleteCertificate'),
+            okTitle: this.$t('global.action.delete')
+          }
+        )
+        .then(deleteConfirmed => {
+          if (deleteConfirmed) this.deleteCertificate(certificate);
+        });
+    },
+    onModalOk({ addNew, file, type, location }) {
+      if (addNew) {
+        // Upload a new certificate
+        this.addNewCertificate(file, type);
+      } else {
+        // Replace an existing certificate
+        this.replaceCertificate(file, type, location);
+      }
+    },
+    addNewCertificate(file, type) {
+      this.$store
+        .dispatch('sslCertificates/addNewCertificate', { file, type })
+        .then(success => this.successToast(success))
+        .catch(({ message }) => this.errorToast(message));
+    },
+    replaceCertificate(file, type, location) {
+      const reader = new FileReader();
+      reader.readAsBinaryString(file);
+      reader.onloadend = event => {
+        const certificateString = event.target.result;
+        this.$store
+          .dispatch('sslCertificates/replaceCertificate', {
+            certificateString,
+            type,
+            location
+          })
+          .then(success => this.successToast(success))
+          .catch(({ message }) => this.errorToast(message));
+      };
+    },
+    deleteCertificate({ type, location }) {
+      this.$store
+        .dispatch('sslCertificates/deleteCertificate', {
+          type,
+          location
+        })
+        .then(success => this.successToast(success))
+        .catch(({ message }) => this.errorToast(message));
+    }
+  }
+};
+</script>
diff --git a/src/views/AccessControl/SslCertificates/index.js b/src/views/AccessControl/SslCertificates/index.js
new file mode 100644
index 0000000..03daa56
--- /dev/null
+++ b/src/views/AccessControl/SslCertificates/index.js
@@ -0,0 +1,2 @@
+import SslCertificates from './SslCertificates.vue';
+export default SslCertificates;