diff --git a/package-lock.json b/package-lock.json
index 8c210514..39b9fe88 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -63,7 +63,7 @@
         "@vue/cli-service": "3.12.1",
         "@vue/runtime-dom": "3.4.21",
         "copy-webpack-plugin": "5.1.2",
-        "cross-env": "7.0.3",
+        "cross-env": "^7.0.3",
         "eslint": "8.57.0",
         "eslint-config-prettier": "9.1.0",
         "eslint-plugin-prettier": "5.1.3",
diff --git a/package.json b/package.json
index 68af4a08..540a6af2 100644
--- a/package.json
+++ b/package.json
@@ -76,7 +76,7 @@
     "@vue/cli-service": "3.12.1",
     "@vue/runtime-dom": "3.4.21",
     "copy-webpack-plugin": "5.1.2",
-    "cross-env": "7.0.3",
+    "cross-env": "^7.0.3",
     "eslint": "8.57.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-plugin-prettier": "5.1.3",
diff --git a/src/containers/DefaultContainer.vue b/src/containers/DefaultContainer.vue
index 9190536d..5a8bb170 100644
--- a/src/containers/DefaultContainer.vue
+++ b/src/containers/DefaultContainer.vue
@@ -90,6 +90,12 @@ export default {
           icon: 'fa fa-cubes',
           permission: permissions.VIEW_PORTFOLIO,
         },
+        {
+          name: this.$t('message.crypto_assets'),
+          url: '/cryptoassets',
+          icon: 'fa fa-lock',
+          permission: permissions.VIEW_PORTFOLIO,
+        },
         {
           name: this.$t('message.vulnerabilities'),
           url: '/vulnerabilities',
diff --git a/src/forms/BInputGroupFormInputNumber.vue b/src/forms/BInputGroupFormInputNumber.vue
new file mode 100644
index 00000000..2b7d8fe6
--- /dev/null
+++ b/src/forms/BInputGroupFormInputNumber.vue
@@ -0,0 +1,132 @@
+<template>
+  <b-form-group
+    :id="id"
+    :label="label"
+    :label-for="`${id}-input`"
+    :label-class="labelClasses"
+  >
+    <b-input-group :class="inputGroupSize">
+      <b-input-group-prepend v-if="icon"
+        ><b-input-group-text><i :class="icon"></i></b-input-group-text
+      ></b-input-group-prepend>
+      <b-form-input
+        :id="`${id}-input`"
+        :type="type"
+        :class="inputClasses"
+        v-model="innerValue"
+        :placeholder="label"
+        :state="feedbackState()"
+        :autocomplete="autocomplete"
+        :autofocus="isFocused"
+        :required="isRequired"
+        :readonly="readonly"
+        :disabled="isDisabled"
+        v-on="inputListeners"
+        v-on:blur="hadFocus = true"
+        trim
+      />
+      <b-input-group-append v-if="tooltip"
+        ><b-input-group-text v-b-tooltip.hover :title="tooltip"
+          ><i class="cui-info font-lg"></i></b-input-group-text
+      ></b-input-group-append>
+    </b-input-group>
+    <b-form-invalid-feedback
+      v-if="this.feedback === 'true'"
+      :state="feedbackState()"
+    >
+      {{ feedbackText }}
+    </b-form-invalid-feedback>
+  </b-form-group>
+</template>
+
+<script>
+import common from '../shared/common';
+
+export default {
+  props: {
+    id: String,
+    label: String,
+    value: Number,
+    inputGroupSize: String,
+    icon: String,
+    type: String,
+    autocomplete: String,
+    autofocus: String,
+    tooltip: String,
+    feedbackText: String,
+    feedback: String,
+    lazy: String,
+    required: String,
+    readonly: Boolean,
+    disabled: String,
+    state: {
+      default: undefined,
+      type: Boolean,
+    },
+  },
+  data() {
+    return {
+      isFocused: false,
+      isRequired: false,
+      isDisabled: false,
+      hadFocus: false,
+    };
+  },
+  beforeMount() {
+    this.isFocused = common.toBoolean(this.autofocus);
+    this.isRequired = common.toBoolean(this.required);
+    this.isDisabled = common.toBoolean(this.disabled);
+  },
+  computed: {
+    innerValue: {
+      get: function () {
+        if (this.value && this.value.length > 0) {
+          //
+        }
+        return this.value;
+      },
+      set: function (newValue) {
+        return newValue;
+      },
+    },
+    inputListeners: function () {
+      const vm = this;
+      return Object.assign({}, this.$listeners, {
+        input: function (event) {
+          vm.$emit('input', event);
+        },
+      });
+    },
+    inputClasses: function () {
+      return this.isRequired ? 'required' : null;
+    },
+    labelClasses: function () {
+      return this.isRequired ? 'required' : null;
+    },
+  },
+  methods: {
+    feedbackState: function () {
+      if (this.isDisabled && !this.isRequired) {
+        return undefined;
+      }
+      if (this.state !== undefined) {
+        return this.state;
+      }
+      if (common.toBoolean(this.lazy) && common.toBoolean(this.required)) {
+        if (this.value && this.value.length > 0) {
+          return true;
+        } else if (this.hadFocus) {
+          return false;
+        } else {
+          return undefined;
+        }
+      }
+      if (this.value && this.value.length > 0) {
+        return true;
+      } else {
+        return undefined;
+      }
+    },
+  },
+};
+</script>
diff --git a/src/forms/BInputGroupFormSelectMultiple.vue b/src/forms/BInputGroupFormSelectMultiple.vue
new file mode 100644
index 00000000..da5f75eb
--- /dev/null
+++ b/src/forms/BInputGroupFormSelectMultiple.vue
@@ -0,0 +1,116 @@
+<template>
+  <b-form-group
+    :id="id"
+    :label="label"
+    :label-for="`${id}-input`"
+    :label-class="labelClasses"
+  >
+    <b-input-group :class="inputGroupSize">
+      <b-input-group-prepend v-if="icon"
+        ><b-input-group-text><i :class="icon"></i></b-input-group-text
+      ></b-input-group-prepend>
+
+      <b-form-select
+        :id="`${id}-input`"
+        v-model="value"
+        :options="options"
+        multiple
+        :select-size="3"
+        :autofocus="isFocused"
+        :disabled="disabled"
+        :required="isRequired"
+        :state="feedbackState()"
+        :class="inputClasses"
+        v-on="inputListeners"
+        v-on:blur="hadFocus = true"
+      />
+
+      <b-input-group-append v-if="tooltip"
+        ><b-input-group-text v-b-tooltip.hover :title="tooltip"
+          ><i class="cui-info font-lg"></i></b-input-group-text
+      ></b-input-group-append>
+    </b-input-group>
+    <b-form-invalid-feedback
+      v-if="this.feedback === 'true'"
+      :state="feedbackState()"
+    >
+      {{ feedbackText }}
+    </b-form-invalid-feedback>
+  </b-form-group>
+</template>
+
+<script>
+import common from '../shared/common';
+
+export default {
+  props: {
+    id: String,
+    label: String,
+    value: Array,
+    options: Array,
+    inputGroupSize: String,
+    icon: String,
+    type: String,
+    autocomplete: String,
+    autofocus: String,
+    tooltip: String,
+    feedbackText: String,
+    feedback: String,
+    lazy: String,
+    required: String,
+    disabled: Boolean,
+    state: {
+      default: undefined,
+      type: Boolean,
+    },
+  },
+  data() {
+    return {
+      isFocused: false,
+      isRequired: false,
+      hadFocus: false,
+    };
+  },
+  beforeMount() {
+    this.isFocused = common.toBoolean(this.autofocus);
+    this.isRequired = common.toBoolean(this.required);
+  },
+  computed: {
+    inputListeners: function () {
+      const vm = this;
+      return Object.assign({}, this.$listeners, {
+        input: function (event) {
+          vm.$emit('input', event);
+        },
+      });
+    },
+    inputClasses: function () {
+      return this.isRequired ? 'required' : null;
+    },
+    labelClasses: function () {
+      return this.isRequired ? 'required' : null;
+    },
+  },
+  methods: {
+    feedbackState: function () {
+      if (this.state !== undefined) {
+        return this.state;
+      }
+      if (common.toBoolean(this.lazy) && common.toBoolean(this.required)) {
+        if (this.value && this.value.length > 0) {
+          return true;
+        } else if (this.hadFocus) {
+          return false;
+        } else {
+          return undefined;
+        }
+      }
+      if (this.value && this.value.length > 0) {
+        return true;
+      } else {
+        return undefined;
+      }
+    },
+  },
+};
+</script>
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
index 94327b2d..7fbb7aac 100644
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@@ -343,6 +343,7 @@
     "add_affected_component": "Add Affected Component",
     "add_comment": "Add Comment",
     "add_component": "Add Component",
+    "add_cryptoAsset": "Add Crypto Asset",
     "add_license": "Add License",
     "add_tag": "Add Tag",
     "add_version": "Add Version",
@@ -394,6 +395,8 @@
     "component_container": "Container",
     "component_cpe_desc": "The CPE v2.2 or v2.3 URI as provided by MITRE or NIST. All assets (applications, operating systems, and hardware) should have a CPE specified",
     "component_created": "Component created",
+    "component_cryptographic_asset": "Cryptographic Asset",
+    "component_cryptographic_properties": "Cryptographic Properties",
     "component_deleted": "Component deleted",
     "component_details": "Component Details",
     "component_device": "Device",
@@ -442,6 +445,97 @@
     "create_vulnerability": "Create Vulnerability",
     "created": "Created",
     "credits": "Credits",
+    "cryptoAsset_deleted": "Crypto Asset deleted",
+    "crypto_algo_certLvl": "Certification Level",
+    "crypto_algo_certLvl_desc": "The Certification Level of the crytographic algorithm",
+    "crypto_algo_classicalSL": "Classical Security Level",
+    "crypto_algo_classicalSL_desc": "The classicial security level of the crytographic algorithm",
+    "crypto_algo_cryptoFunctions": "Cryptographic Functions",
+    "crypto_algo_cryptoFunctions_desc": "The crypto functions implemented by the crytographic algorithm",
+    "crypto_algo_curve": "Curve",
+    "crypto_algo_curve_desc": "The underlying Elliptic Curve of the crytographic algorithm",
+    "crypto_algo_execEnv": "Execution Environment",
+    "crypto_algo_execEnv_desc": "The Execution Environment of the crytographic algorithm",
+    "crypto_algo_implPlfm": "Implementation Platform",
+    "crypto_algo_implPlfm_desc": "The Implementation Platform of the crytographic algorithm",
+    "crypto_algo_mode": "Mode",
+    "crypto_algo_mode_desc": "The mode of operation of the crytographic algorithm",
+    "crypto_algo_nistQSL": "NIST Quantum Security Level",
+    "crypto_algo_nistQSL_desc": "The NIST Quantum Security Level of the crytographic algorithm",
+    "crypto_algo_padding": "Padding",
+    "crypto_algo_padding_desc": "The padding scheme of the crytographic algorithm",
+    "crypto_algo_parameterSetId": "Parameter Set Identifier",
+    "crypto_algo_parameterSetId_desc": "Parameter Set Identifier",
+    "crypto_algo_primitive": "Primitive",
+    "crypto_algo_primitive_desc": "The primitive of the crytographic algorithm",
+    "crypto_asset": "Crypto Asset",
+    "crypto_assetType": "Asset Type",
+    "crypto_assetType_desc": "The type of the crypto asset as provided by the supplier",
+    "crypto_assets": "Crypto Assets",
+    "crypto_cert_ext": "Certificate Format",
+    "crypto_cert_ext_desc": "The file extension of the certificate",
+    "crypto_cert_format": "Certificate Format",
+    "crypto_cert_format_desc": "The format of the certificate",
+    "crypto_cert_issuer": "Issuer Name",
+    "crypto_cert_issuer_desc": "The issuer name for the certificate",
+    "crypto_cert_notValidAfter": "Not Valid After",
+    "crypto_cert_notValidAfter_desc": "ISO8601 date and time after which the certificate is not valid",
+    "crypto_cert_notValidBefore": "Not Valid Before",
+    "crypto_cert_notValidBefore_desc": "ISO8601 date and time from which the certificate is valid",
+    "crypto_cert_signAlgoRef": "Signature Algorithm Reference",
+    "crypto_cert_signAlgoRef_desc": "The bom-ref to signature algorithm used by the certificate",
+    "crypto_cert_subjPubKeyRef": "Subject Public Key Reference",
+    "crypto_cert_subjPubKeyRef_desc": "The bom-ref to the public key of the subject",
+    "crypto_cert_subject": "Subject Name",
+    "crypto_cert_subject_desc": "The subject name for the certificate",
+    "crypto_oid": "OID",
+    "crypto_oid_desc": "The Object Identifier of the cryptographic asset",
+    "crypto_prot_cipherSuites": "Cipher Suites",
+    "crypto_prot_cipherSuites_desc": "A comma-separated list of cipher suites",
+    "crypto_prot_cryptoRefs": "Cryptographic Reference Array",
+    "crypto_prot_cryptoRefs_desc": "A comma-separated list of bom-refs to protocol-related cryptographic assets",
+    "crypto_prot_ikev2Auth": "IKEv2 Transform Type: Authentication Method",
+    "crypto_prot_ikev2Auth_desc": "Internet Key Exchange v2 authentication method",
+    "crypto_prot_ikev2Encr": "IKEv2 Transform Type 1: Encryption Algorithms",
+    "crypto_prot_ikev2Encr_desc": "Internet Key Exchange v2 Transform Type 1: encryption algorithms",
+    "crypto_prot_ikev2Esn": "IKEv2 Transform Type: Extended Sequence Number",
+    "crypto_prot_ikev2Esn_desc": "Internet Key Exchange v2 extended sequence number ",
+    "crypto_prot_ikev2Integ": "IKEv2 Transform Type 3: Encryption Algorithms",
+    "crypto_prot_ikev2Integ_desc": "Internet Key Exchange v2 Transform Type 3: integrity algorithms",
+    "crypto_prot_ikev2Ke": "IKEv2 Transform Type 4: Key Exchange Method",
+    "crypto_prot_ikev2Ke_desc": "Internet Key Exchange v2 Transform Type 4: Key Exchange Method (KE) per RFC9370, formerly called Diffie-Hellman Group (D-H)",
+    "crypto_prot_ikev2Prf": "IKEv2 Transform Type 2: Pseudorandom Functions",
+    "crypto_prot_ikev2Prf_desc": "Internet Key Exchange v2 Transform Type 2: integrity algorithms",
+    "crypto_prot_type": "Protocol Type",
+    "crypto_prot_type_desc": "The protocol type",
+    "crypto_prot_version": "Protocol Version",
+    "crypto_prot_version_desc": "The protocol version",
+    "crypto_rcm_adate": "Activation Date",
+    "crypto_rcm_adate_desc": "ISO8601 date and time when related cryptographic materia was activated",
+    "crypto_rcm_algoRef": "Algorithm Reference",
+    "crypto_rcm_algoRef_desc": "The bom-ref to the algorithm used to generate the related cryptographic material",
+    "crypto_rcm_cdate": "Creation Date",
+    "crypto_rcm_cdate_desc": "ISO8601 date and time when related cryptographic materia was created",
+    "crypto_rcm_edate": "Expiration Date",
+    "crypto_rcm_edate_desc": "ISO8601 date and time when related cryptographic material expires",
+    "crypto_rcm_format": "Format",
+    "crypto_rcm_format_desc": "The format of the related cryptographic material",
+    "crypto_rcm_id": "Id",
+    "crypto_rcm_id_desc": "The optional unique identifier for the related cryptographic material.",
+    "crypto_rcm_secByAlgoRef": "Secured by Algorithm Reference",
+    "crypto_rcm_secByAlgoRef_desc": "The bom-ref to the algorithm the cryptographic asset is secured by",
+    "crypto_rcm_secByMech": "Secured by Mechanism",
+    "crypto_rcm_secByMech_desc": "The mechanism the cryptographic asset is secured by",
+    "crypto_rcm_size": "Size",
+    "crypto_rcm_size_desc": "The size of the cryptographic asset in bits",
+    "crypto_rcm_state": "State",
+    "crypto_rcm_state_desc": "The key state as defined by NIST SP 800-57",
+    "crypto_rcm_type": "Type",
+    "crypto_rcm_type_desc": "The type for the related cryptographic material",
+    "crypto_rcm_udate": "Update Date",
+    "crypto_rcm_udate_desc": "ISO8601 date and time when related cryptographic materia was updated",
+    "crypto_rcm_value": "Value",
+    "crypto_rcm_value_desc": "The associated value of the cryptographic material",
     "custom_license": "Custom License",
     "custom_license_deleted": "Custom License Deleted",
     "cvss": "CVSS",
@@ -498,6 +592,7 @@
     "direct_only": "Direct only",
     "direction": "Direction",
     "download_bom": "Download BOM",
+    "download_cbom": "Download CBOM",
     "email": "Email",
     "empty_selection": "No items selected",
     "endpoints": "Endpoints",
@@ -585,6 +680,7 @@
     "matrix": "Matrix",
     "method": "Method",
     "metric_refresh_requested": "A refresh has been requested. Metrics will be updated when the refresh task has completed.",
+    "mostUsedAlgorithm": "Most used cryptographic algorithm",
     "name": "Name",
     "no_file_chosen": "No file chosen",
     "non_vulnerable": "Non Vulnerable",
@@ -592,6 +688,8 @@
     "not_found_in_dependency_graph": "Dependency could not be found in dependency graph",
     "not_set": "Not Set",
     "notes": "Notes",
+    "numberOfCryptoAssets": "Number of cryptographic assets",
+    "numberOfKeys": "Number of cryptographic keys",
     "object_identifier": "Object Identifier",
     "object_identifier_desc": "A unique identifier (UUID) that Dependency-Track automatically assigns to every object",
     "occurred_on": "Occurred On",
@@ -771,10 +869,12 @@
     "reindex": "Rebuild index(es)",
     "rejected": "Rejected",
     "remove_component": "Remove Component",
+    "remove_cryptoAsset": "Remove Crypto Asset",
     "reported_by": "Reported By",
     "required_component_identifier": "A component identifier is required",
     "required_component_name": "The component name is required",
     "required_component_version": "The component version is required",
+    "required_crypto_assetType": "The type of the crypto asset is required",
     "required_license_id": "The license ID is required",
     "required_license_name": "The license name is required",
     "required_project_name": "The project name is required",
@@ -850,6 +950,7 @@
     "upload": "Upload",
     "upload_bom": "Upload BOM",
     "upload_bom_tooltip": "Upload BOM, all components will be analyzed for vulnerabilities",
+    "upload_cbom": "Upload CBOM",
     "upload_vex": "Upload VEX",
     "url": "URL",
     "urls": "URLs",
diff --git a/src/router/index.js b/src/router/index.js
index 1153d028..84e050a2 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -4,6 +4,8 @@ import i18n from '../i18n';
 import EventBus from '../shared/eventbus';
 import { getToken, hasPermission } from '../shared/permissions';
 import { getContextPath } from '../shared/utils';
+import CryptoAsset from '../views/portfolio/projects/CryptoAsset';
+import CryptoAssets from '../views/portfolio/cryptoassets/CryptoAssets';
 
 // Containers
 const DefaultContainer = () => import('@/containers/DefaultContainer');
@@ -242,6 +244,26 @@ function configRoutes() {
             permissions: ['VIEW_PORTFOLIO'],
           },
         },
+        {
+          path: 'cryptoassets',
+          name: 'CryptoAssets',
+          component: CryptoAssets,
+          meta: {
+            title: i18n.t('message.component_search'),
+            i18n: 'message.crypto_assets',
+            sectionPath: '/cryptoassets',
+          },
+        },
+        {
+          path: '/cryptoassets/:uuid',
+          name: 'CryptoAsset',
+          props: (route) => ({ uuid: route.params.uuid }),
+          component: CryptoAsset,
+          meta: {
+            i18n: 'message.projects',
+            sectionPath: '/projects',
+          },
+        },
         {
           path: 'vulnerabilities',
           name: 'Vulnerabilities',
diff --git a/src/shared/api.json b/src/shared/api.json
index a38230cb..db304da0 100644
--- a/src/shared/api.json
+++ b/src/shared/api.json
@@ -19,6 +19,7 @@
   "URL_CALCULATOR_OWASP": "api/v1/calculator/owasp",
   "URL_COMPONENT": "api/v1/component",
   "URL_CONFIG_PROPERTY": "api/v1/configProperty",
+  "URL_CRYPTO_ASSET": "api/v1/crypto",
   "URL_CWE": "api/v1/cwe",
   "URL_DEPENDENCY_GRAPH": "api/v1/dependencyGraph",
   "URL_FINDING": "api/v1/finding",
diff --git a/src/shared/common.js b/src/shared/common.js
index 86f1cc07..dc389645 100644
--- a/src/shared/common.js
+++ b/src/shared/common.js
@@ -418,6 +418,7 @@ $common.componentClassifierLabelFormatter = (i18n) => {
       case 'DEVICE':
       case 'FIRMWARE':
       case 'FILE':
+      case 'CRYPTOGRAPHIC_ASSET':
         return i18n.$t(`message.component_${value.toLowerCase()}`);
       default:
         return null;
@@ -444,6 +445,7 @@ $common.componentClassifierLabelProjectUrlFormatter = (i18n) => {
       case 'DEVICE':
       case 'FIRMWARE':
       case 'FILE':
+      case 'CRYPTOGRAPHIC_ASSET':
         return `<a href="${url}">${i18n.$t(
           `message.component_${value.toLowerCase()}`,
         )}</a>`;
diff --git a/src/views/dashboard/CryptoAssetWidgetRow.vue b/src/views/dashboard/CryptoAssetWidgetRow.vue
new file mode 100644
index 00000000..9ba362fd
--- /dev/null
+++ b/src/views/dashboard/CryptoAssetWidgetRow.vue
@@ -0,0 +1,117 @@
+<template>
+  <b-row>
+    <b-col sm="6" lg="4">
+      <b-card no-body class="bg-widget">
+        <b-card-body class="pb-0">
+          <h4 class="mb-0">{{ numberOfCryptographicAssets }}</h4>
+          <p>{{ $t('message.numberOfCryptoAssets') }}</p>
+        </b-card-body>
+        <widget-crypto-assets
+          ref="widgetCryptoAssets"
+          chartId="card-chart-01"
+          class="chart-wrapper px-3"
+          style="height: 70px"
+          :height="70"
+        />
+      </b-card>
+    </b-col>
+    <b-col sm="6" lg="4">
+      <b-card no-body class="bg-widget">
+        <b-card-body class="pb-0">
+          <h4 class="mb-0">
+            <span style="text-transform: uppercase"
+              >{{ mostUsedAlgorithmName }}
+            </span>
+            <span style="font-size: 14px; opacity: 0.7"
+              >({{ mostUsedAlgorithmPercentage }}%)</span
+            >
+          </h4>
+          <p>{{ $t('message.mostUsedAlgorithm') }}</p>
+        </b-card-body>
+        <widget-most-used-algorithm
+          ref="widgetMostUsedAlgorithm"
+          chartId="card-chart-01"
+          class="chart-wrapper px-3"
+          style="height: 70px"
+          :height="70"
+        />
+      </b-card>
+    </b-col>
+    <b-col sm="6" lg="4">
+      <b-card no-body class="bg-widget">
+        <b-card-body class="pb-0">
+          <h4 class="mb-0">
+            {{ numberOfKeys }}
+          </h4>
+          <p>{{ $t('message.numberOfKeys') }}</p>
+        </b-card-body>
+        <widget-number-of-keys
+          ref="widgetNumberOfKeys"
+          chartId="card-chart-03"
+          class="chart-wrapper px-3"
+          style="height: 70px"
+          :height="70"
+        />
+      </b-card>
+    </b-col>
+  </b-row>
+</template>
+
+<script>
+import WidgetCryptoAssets from '@/views/dashboard/WidgetCryptoAssets.vue';
+import WidgetMostUsedAlgorithm from '@/views/dashboard/WidgetMostUsedAlgorithm.vue';
+import WidgetNumberOfKeys from '@/views/dashboard/WidgetNumberOfKeys.vue';
+
+export default {
+  components: {
+    WidgetCryptoAssets,
+    WidgetMostUsedAlgorithm,
+    WidgetNumberOfKeys,
+  },
+  props: {
+    fetch: {
+      default: false,
+      type: Boolean,
+    },
+  },
+  data() {
+    return {
+      numberOfCryptographicAssets: 0,
+      mostUsedAlgorithmName: '',
+      mostUsedAlgorithmPercentage: 0.0,
+      numberOfKeys: 0,
+    };
+  },
+  beforeMount() {
+    if (this.fetch) {
+      const daysBack = 90;
+      let url = `${this.$api.BASE_URL}/${this.$api.URL_METRICS}/cryptography/${daysBack}/days`;
+      this.axios.get(url).then((response) => {
+        this.render(response.data);
+      });
+    }
+  },
+  methods: {
+    render: function (metrics) {
+      if (metrics.length > 0) {
+        this.numberOfCryptographicAssets =
+          metrics[metrics.length - 1].numberOfCryptographicAssets;
+        this.mostUsedAlgorithmName =
+          metrics[metrics.length - 1].mostUsedAlgorithmName;
+        this.mostUsedAlgorithmPercentage =
+          metrics[metrics.length - 1].mostUsedAlgorithmPercentage;
+        this.numberOfKeys = metrics[metrics.length - 1].numberOfKeys;
+      } else {
+        this.numberOfCryptographicAssets = 0;
+        this.mostUsedAlgorithmName = '';
+        this.mostUsedAlgorithmPercentage = 0;
+        this.numberOfKeys = 0;
+      }
+
+      this.$refs.widgetCryptoAssets.render(metrics);
+      this.$refs.widgetMostUsedAlgorithm.render(metrics);
+      this.$refs.widgetNumberOfKeys.render(metrics);
+    },
+  },
+};
+</script>
diff --git a/src/views/dashboard/WidgetCryptoAssets.vue b/src/views/dashboard/WidgetCryptoAssets.vue
new file mode 100644
index 00000000..49b1fb79
--- /dev/null
+++ b/src/views/dashboard/WidgetCryptoAssets.vue
@@ -0,0 +1,87 @@
+<script>
+import { Line } from 'vue-chartjs';
+import { CustomTooltips } from '@coreui/coreui-plugin-chartjs-custom-tooltips';
+import { getStyle, hexToRgba } from '@coreui/coreui/dist/js/coreui-utilities';
+import common from '../../shared/common';
+
+export default {
+  extends: Line,
+  props: {
+    height: Number,
+    width: Number,
+  },
+  methods: {
+    render: function (metrics) {
+      const widgetColor = getStyle('--widget-1');
+      let chartLabels = [];
+      let chartData = [];
+      for (let i = 0; i < metrics.length; i++) {
+        chartLabels.push(common.formatTimestamp(metrics[i].firstOccurrence));
+        chartData.push(metrics[i].numberOfCryptographicAssets);
+      }
+
+      const datasets = [
+        {
+          label: this.$t('message.numberOfCryptoAssets'),
+          backgroundColor: hexToRgba(widgetColor, 10),
+          borderColor: widgetColor,
+          pointHoverBackgroundColor: '#fff',
+          data: chartData,
+        },
+      ];
+
+      this.renderChart(
+        {
+          labels: chartLabels,
+          datasets: datasets,
+        },
+        {
+          tooltips: {
+            enabled: false,
+            custom: CustomTooltips,
+          },
+          maintainAspectRatio: false,
+          legend: {
+            display: false,
+          },
+          scales: {
+            xAxes: [
+              {
+                gridLines: {
+                  color: 'transparent',
+                  zeroLineColor: 'transparent',
+                },
+                ticks: {
+                  fontSize: 2,
+                  fontColor: 'transparent',
+                },
+              },
+            ],
+            yAxes: [
+              {
+                display: false,
+                ticks: {
+                  display: false,
+                  min: 0,
+                  max: Math.max.apply(Math, datasets[0].data) + 5,
+                },
+              },
+            ],
+          },
+          elements: {
+            line: {
+              tension: 0.00001,
+              borderWidth: 2,
+            },
+            point: {
+              radius: 0,
+              hitRadius: 10,
+              hoverRadius: 4,
+            },
+          },
+        },
+      );
+    },
+  },
+};
+</script>
diff --git a/src/views/dashboard/WidgetMostUsedAlgorithm.vue b/src/views/dashboard/WidgetMostUsedAlgorithm.vue
new file mode 100644
index 00000000..cd6cf821
--- /dev/null
+++ b/src/views/dashboard/WidgetMostUsedAlgorithm.vue
@@ -0,0 +1,87 @@
+<script>
+import { Line } from 'vue-chartjs';
+import { CustomTooltips } from '@coreui/coreui-plugin-chartjs-custom-tooltips';
+import { getStyle, hexToRgba } from '@coreui/coreui/dist/js/coreui-utilities';
+import common from '../../shared/common';
+
+export default {
+  extends: Line,
+  props: {
+    height: Number,
+    width: Number,
+  },
+  methods: {
+    render: function (metrics) {
+      const widgetColor = getStyle('--widget-3');
+      let chartLabels = [];
+      let chartData = [];
+      for (let i = 0; i < metrics.length; i++) {
+        chartLabels.push(common.formatTimestamp(metrics[i].firstOccurrence));
+        chartData.push(metrics[i].mostUsedAlgorithmPercentage);
+      }
+
+      const datasets = [
+        {
+          label: this.$t('message.crypto_algo_classicalSL'),
+          backgroundColor: hexToRgba(widgetColor, 10),
+          borderColor: widgetColor,
+          pointHoverBackgroundColor: '#fff',
+          data: chartData,
+        },
+      ];
+
+      this.renderChart(
+        {
+          labels: chartLabels,
+          datasets: datasets,
+        },
+        {
+          tooltips: {
+            enabled: false,
+            custom: CustomTooltips,
+          },
+          maintainAspectRatio: false,
+          legend: {
+            display: false,
+          },
+          scales: {
+            xAxes: [
+              {
+                gridLines: {
+                  color: 'transparent',
+                  zeroLineColor: 'transparent',
+                },
+                ticks: {
+                  fontSize: 2,
+                  fontColor: 'transparent',
+                },
+              },
+            ],
+            yAxes: [
+              {
+                display: false,
+                ticks: {
+                  display: false,
+                  min: 0,
+                  max: Math.max.apply(Math, datasets[0].data) + 5,
+                },
+              },
+            ],
+          },
+          elements: {
+            line: {
+              tension: 0.00001,
+              borderWidth: 2,
+            },
+            point: {
+              radius: 0,
+              hitRadius: 10,
+              hoverRadius: 4,
+            },
+          },
+        },
+      );
+    },
+  },
+};
+</script>
diff --git a/src/views/dashboard/WidgetNumberOfKeys.vue b/src/views/dashboard/WidgetNumberOfKeys.vue
new file mode 100644
index 00000000..b9687b49
--- /dev/null
+++ b/src/views/dashboard/WidgetNumberOfKeys.vue
@@ -0,0 +1,87 @@
+<script>
+import { Line } from 'vue-chartjs';
+import { CustomTooltips } from '@coreui/coreui-plugin-chartjs-custom-tooltips';
+import { getStyle, hexToRgba } from '@coreui/coreui/dist/js/coreui-utilities';
+import common from '../../shared/common';
+
+export default {
+  extends: Line,
+  props: {
+    height: Number,
+    width: Number,
+  },
+  methods: {
+    render: function (metrics) {
+      const widgetColor = getStyle('--widget-2');
+      let chartLabels = [];
+      let chartData = [];
+      for (let i = 0; i < metrics.length; i++) {
+        chartLabels.push(common.formatTimestamp(metrics[i].firstOccurrence));
+        chartData.push(metrics[i].numberOfKeys);
+      }
+
+      const datasets = [
+        {
+          label: this.$t('message.crypto_algo_classicalSL'),
+          backgroundColor: hexToRgba(widgetColor, 10),
+          borderColor: widgetColor,
+          pointHoverBackgroundColor: '#fff',
+          data: chartData,
+        },
+      ];
+
+      this.renderChart(
+        {
+          labels: chartLabels,
+          datasets: datasets,
+        },
+        {
+          tooltips: {
+            enabled: false,
+            custom: CustomTooltips,
+          },
+          maintainAspectRatio: false,
+          legend: {
+            display: false,
+          },
+          scales: {
+            xAxes: [
+              {
+                gridLines: {
+                  color: 'transparent',
+                  zeroLineColor: 'transparent',
+                },
+                ticks: {
+                  fontSize: 2,
+                  fontColor: 'transparent',
+                },
+              },
+            ],
+            yAxes: [
+              {
+                display: false,
+                ticks: {
+                  display: false,
+                  min: 0,
+                  max: Math.max.apply(Math, datasets[0].data) + 5,
+                },
+              },
+            ],
+          },
+          elements: {
+            line: {
+              tension: 0.00001,
+              borderWidth: 2,
+            },
+            point: {
+              radius: 0,
+              hitRadius: 10,
+              hoverRadius: 4,
+            },
+          },
+        },
+      );
+    },
+  },
+};
+</script>
diff --git a/src/views/portfolio/cryptoassets/CryptoAssets.vue b/src/views/portfolio/cryptoassets/CryptoAssets.vue
new file mode 100644
index 00000000..bac668bb
--- /dev/null
+++ b/src/views/portfolio/cryptoassets/CryptoAssets.vue
@@ -0,0 +1,271 @@
+<template>
+  <div class="animated fadeIn" v-permission="'VIEW_PORTFOLIO'">
+    <crypto-asset-widget-row ref="cryptoAssetWidgetRow" />
+
+    <b-card>
+      <div id="cryptoAssetSearchToolbar">
+        <b-row>
+          <b-col md="5" lg="5">
+            <b-input-group-form-select
+              id="input-subject"
+              required="true"
+              v-model="subject"
+              :options="subjects"
+            />
+          </b-col>
+          <b-col md="6" lg="6">
+            <b-input-group-form-input
+              v-if="subject !== 'ASSET TYPE'"
+              id="input-value"
+              required="true"
+              type="text"
+              v-model="value"
+              lazy="true"
+              v-on:keyup.enter="performSearch"
+            />
+            <b-form-select
+              v-else-if="subject === 'ASSET TYPE'"
+              v-model="value"
+              :required="true"
+              :options="assetTypeOptions"
+              id="input-aead-value"
+              v-on:keyup.enter="performSearch"
+            />
+          </b-col>
+          <b-col md="1" lg="1">
+            <b-button variant="outline-primary" v-on:click="performSearch">{{
+              $t('message.search')
+            }}</b-button>
+          </b-col>
+        </b-row>
+      </div>
+      <bootstrap-table
+        ref="table"
+        :columns="columns"
+        :data="data"
+        :options="options"
+      >
+      </bootstrap-table>
+    </b-card>
+  </div>
+</template>
+
+<script>
+import BInputGroupFormSelect from '../../../forms/BInputGroupFormSelect';
+import BInputGroupFormInput from '../../../forms/BInputGroupFormInput';
+import common from '@/shared/common';
+import xssFilters from 'xss-filters';
+import CryptoAssetWidgetRow from '@/views/dashboard/CryptoAssetWidgetRow';
+import permissionsMixin from '@/mixins/permissionsMixin';
+
+export default {
+  mixins: [permissionsMixin],
+  components: {
+    CryptoAssetWidgetRow,
+    BInputGroupFormSelect,
+    BInputGroupFormInput,
+  },
+  name: 'CryptoAssets',
+  methods: {
+    createQueryParams: function () {
+      if (this.subject === 'ASSET TYPE') {
+        let v = common.trimToNull(this.value);
+        return v != null ? 'assetType=' + encodeURIComponent(v) : '';
+      }
+    },
+    performSearch: function () {
+      let queryParams = this.createQueryParams();
+      this.options.url = `${this.$api.BASE_URL}/${this.$api.URL_CRYPTO_ASSET}/identity?${queryParams}`;
+      this.$refs.table.refresh({ silent: true });
+    },
+    extractStats(metrics) {
+      if (!metrics || metrics.length === 0) {
+        return;
+      }
+      let metric = metrics[metrics.length - 1]; //Use the most recent metric
+      this.numberOfCryptoAssets = common.valueWithDefault(
+        metric.numberOfCryptographicAssets,
+        '0',
+      );
+      this.notEnoughInformationToStateQSComponents = common.valueWithDefault(
+        metric.notEnoughInformationToStateQSComponents,
+        '0',
+      );
+      this.numberOfQuantumSafeComponents = common.valueWithDefault(
+        metric.quantumSafeComponents,
+        '0',
+      );
+      this.consideredComponents =
+        this.notEnoughInformationToStateQSComponents +
+        this.numberOfQuantumSafeComponents;
+      this.quantumSafeProgressPercent = common.calcProgressPercent(
+        this.consideredComponents,
+        this.numberOfQuantumSafeComponents,
+      );
+    },
+  },
+  data() {
+    return {
+      quantumSafeProgressPercent: 0,
+      numberOfCryptoAssets: 0,
+      numberOfQuantumSafeComponents: 0,
+      notEnoughInformationToStateQSComponents: 0,
+      consideredComponents: 0,
+
+      subject: 'ASSET TYPE',
+      value: null,
+      coordinatesGroup: null,
+      coordinatesName: null,
+      coordinatesVersion: null,
+      subjects: [
+        { value: 'ASSET TYPE', text: this.$t('message.crypto_assetType') },
+      ],
+      assetTypeOptions: [
+        { value: null, text: 'ALL' },
+        { value: 'ALGORITHM', text: 'Algorithm' },
+        { value: 'CERTIFICATE', text: 'Certificate' },
+        { value: 'RELATED_CRYPTO_MATERIAL', text: 'Related Crypto Material' },
+        { value: 'PROTOCOL', text: 'Protocol' },
+      ],
+      columns: [
+        {
+          field: 'state',
+          checkbox: true,
+          align: 'center',
+        },
+        {
+          title: this.$t('message.crypto_assets'),
+          field: 'name',
+          sortable: true,
+          formatter(value, row, index) {
+            let url = xssFilters.uriInUnQuotedAttr('../components/' + row.uuid);
+            return `<a href="${url}">${xssFilters.inHTMLData(value)}</a>`;
+          },
+        },
+        {
+          title: this.$t('message.version'),
+          field: 'version',
+          sortable: true,
+          formatter(value, row) {
+            if (
+              Object.prototype.hasOwnProperty.call(row, 'repositoryMeta') &&
+              Object.prototype.hasOwnProperty.call(
+                row.repositoryMeta,
+                'latestVersion',
+              )
+            ) {
+              row.latestVersion = row.repositoryMeta.latestVersion;
+              if (row.repositoryMeta.latestVersion !== row.version) {
+                return (
+                  '<span style="float:right" data-toggle="tooltip" data-placement="bottom" title="Risk: Outdated component. Current version is: ' +
+                  xssFilters.inHTMLData(row.repositoryMeta.latestVersion) +
+                  '"><i class="fa fa-exclamation-triangle status-warning" aria-hidden="true"></i></span> ' +
+                  xssFilters.inHTMLData(row.version)
+                );
+              } else {
+                return (
+                  '<span style="float:right" data-toggle="tooltip" data-placement="bottom" title="Component version is the latest available from the configured repositories"><i class="fa fa-exclamation-triangle status-passed" aria-hidden="true"></i></span> ' +
+                  xssFilters.inHTMLData(row.version)
+                );
+              }
+            } else {
+              return xssFilters.inHTMLData(common.valueWithDefault(value, ''));
+            }
+          },
+        },
+        {
+          title: this.$t('message.latest_version'),
+          field: 'latestVersion',
+          sortable: false,
+          visible: false,
+          formatter(value) {
+            return xssFilters.inHTMLData(common.valueWithDefault(value, ''));
+          },
+        },
+        {
+          title: this.$t('message.crypto_assetType'),
+          field: 'cryptoAssetProperties.assetType',
+          sortable: true,
+          formatter(value) {
+            if (typeof value === 'undefined') {
+              return '-'; // No primitive info available
+            }
+            return xssFilters.inHTMLData(common.valueWithDefault(value, ''));
+          },
+        },
+        {
+          title: this.$t('message.crypto_oid'),
+          field: 'cryptoAssetProperties.oid',
+          sortable: true,
+          formatter(value) {
+            if (typeof value === 'undefined') {
+              return '-'; // No primitive info available
+            }
+            return xssFilters.inHTMLData(value);
+          },
+        },
+        {
+          title: this.$t('message.crypto_algo_primitive'),
+          field: 'cryptoAssetProperties.algorithmProperties.primitive',
+          sortable: true,
+          formatter(value) {
+            if (typeof value === 'undefined') {
+              return '-'; // No primitive info available
+            }
+            return xssFilters.inHTMLData(common.valueWithDefault(value, ''));
+          },
+        },
+        {
+          title: this.$t('message.crypto_algo_nistQSL'),
+          field:
+            'cryptoAssetProperties.algorithmProperties.nistQuantumSecurityLevel',
+          sortable: true,
+          class: 'tight',
+        },
+        {
+          title: this.$t('message.crypto_algo_classicalSL'),
+          field:
+            'cryptoAssetProperties.algorithmProperties.classicalSecurityLevel',
+          sortable: true,
+          class: 'tight',
+        },
+      ],
+      data: [],
+      options: {
+        onPostBody: this.initializeTooltips,
+        search: false,
+        showColumns: true,
+        showRefresh: true,
+        pagination: true,
+        silentSort: false,
+        toolbar: '#cryptoAssetSearchToolbar',
+        sidePagination: 'server',
+        queryParamsType: 'pageSize',
+        pageList: '[10, 25, 50, 100]',
+        pageSize: 10,
+        icons: {
+          refresh: 'fa-refresh',
+        },
+        //toolbar: '#componentSearchToolbar',
+        responseHandler: function (res, xhr) {
+          res.total = xhr.getResponseHeader('X-Total-Count');
+          return res;
+        },
+        url: `${this.$api.BASE_URL}/${this.$api.URL_CRYPTO_ASSET}/identity`,
+      },
+    };
+  },
+  mounted() {
+    if (this.isPermitted(this.PERMISSIONS.VIEW_PORTFOLIO)) {
+      const daysBack = 90;
+      let url = `${this.$api.BASE_URL}/${this.$api.URL_METRICS}/cryptography/${daysBack}/days`;
+      this.axios.get(url).then((response) => {
+        this.$refs.cryptoAssetWidgetRow.render(response.data);
+        this.extractStats(response.data);
+      });
+    }
+  },
+};
+</script>
+
+<style scoped></style>
diff --git a/src/views/portfolio/projects/ComponentDetailsModal.vue b/src/views/portfolio/projects/ComponentDetailsModal.vue
index 74adc391..24464ee2 100644
--- a/src/views/portfolio/projects/ComponentDetailsModal.vue
+++ b/src/views/portfolio/projects/ComponentDetailsModal.vue
@@ -204,6 +204,737 @@
           </b-form-group>
         </b-card>
       </b-tab>
+      <div v-if="component.cryptoAssetProperties != undefined">
+        <b-tab>
+          <template v-slot:title
+            ><i class="fa fa-lock"></i>
+            {{ $t('message.component_cryptographic_properties') }}</template
+          >
+          <b-card>
+            <b-input-group-form-select
+              id="component-assetType-input"
+              required="true"
+              v-model="component.cryptoAssetProperties.assetType"
+              :options="assetTypeOptions"
+              :label="$t('message.crypto_assetType')"
+              :tooltip="$t('message.crypto_assetType_desc')"
+              :disabled="this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)"
+            />
+            <b-input-group-form-input
+              id="component-oid-input"
+              input-group-size="mb-3"
+              type="text"
+              v-model="component.cryptoAssetProperties.oid"
+              lazy="true"
+              required="false"
+              feedback="true"
+              autofocus="false"
+              :label="$t('message.crypto_oid')"
+              :tooltip="this.$t('message.crypto_oid_desc')"
+              :readonly="this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)"
+            />
+            <div
+              v-if="component.cryptoAssetProperties.assetType === 'algorithm'"
+            >
+              <b-input-group-form-select
+                id="component-algo-primitive-input"
+                required="false"
+                v-model="
+                  component.cryptoAssetProperties.algorithmProperties.primitive
+                "
+                :options="primitiveOptions"
+                :label="$t('message.crypto_algo_primitive')"
+                :tooltip="$t('message.crypto_algo_primitive_desc')"
+                :disabled="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-algo-parameter-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.algorithmProperties
+                    .parameterSetIdentifier
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_algo_parameterSetId')"
+                :tooltip="this.$t('message.crypto_algo_parameterSetId_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-algo-curve-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.algorithmProperties.curve
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_algo_curve')"
+                :tooltip="this.$t('message.crypto_algo_curve_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-select
+                id="component-algo-execEnv-input"
+                required="false"
+                v-model="
+                  component.cryptoAssetProperties.algorithmProperties
+                    .executionEnvironment
+                "
+                :options="execEnvOptions"
+                :label="$t('message.crypto_algo_execEnv')"
+                :tooltip="$t('message.crypto_algo_execEnv_desc')"
+                :disabled="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-select
+                id="component-algo-implPlfm-input"
+                required="false"
+                v-model="
+                  component.cryptoAssetProperties.algorithmProperties
+                    .implementationPlatform
+                "
+                :options="implPflmOptions"
+                :label="$t('message.crypto_algo_implPlfm')"
+                :tooltip="$t('message.crypto_algo_implPlfm_desc')"
+                :disabled="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-select
+                id="component-algo-certLvl-input"
+                required="false"
+                v-model="
+                  component.cryptoAssetProperties.algorithmProperties
+                    .certificationLevel
+                "
+                :options="certLvlOptions"
+                :label="$t('message.crypto_algo_certLvl')"
+                :tooltip="$t('message.crypto_algo_certLvl_desc')"
+                :disabled="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-select
+                id="component-algo-mode-input"
+                required="false"
+                v-model="
+                  component.cryptoAssetProperties.algorithmProperties.mode
+                "
+                :options="modeOptions"
+                :label="$t('message.crypto_algo_mode')"
+                :tooltip="$t('message.crypto_algo_mode_desc')"
+                :disabled="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-select
+                id="component-algo-padding-input"
+                required="false"
+                v-model="
+                  component.cryptoAssetProperties.algorithmProperties.padding
+                "
+                :options="paddingOptions"
+                :label="$t('message.crypto_algo_padding')"
+                :tooltip="$t('message.crypto_algo_padding_desc')"
+                :disabled="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-select-multiple
+                id="component-algo-cryptoFunctions-input"
+                required="false"
+                v-model="
+                  this.component.cryptoAssetProperties.algorithmProperties
+                    .cryptoFunctions
+                "
+                :options="cryptoFunctionOptions"
+                :label="$t('message.crypto_algo_cryptoFunctions')"
+                :tooltip="$t('message.crypto_algo_cryptoFunctions_desc')"
+                :disabled="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input-number
+                id="component-algo-classicalSL-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  this.component.cryptoAssetProperties.algorithmProperties
+                    .classicalSecurityLevel
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_algo_classicalSL')"
+                :tooltip="this.$t('message.crypto_algo_classicalSL_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input-number
+                id="component-algo-nistQSL-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  this.component.cryptoAssetProperties.algorithmProperties
+                    .nistQuantumSecurityLevel
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_algo_nistQSL')"
+                :tooltip="this.$t('message.crypto_algo_nistQSL_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+            </div>
+            <div
+              v-else-if="
+                component.cryptoAssetProperties.assetType === 'certificate'
+              "
+            >
+              <b-input-group-form-input
+                id="component-cert-subject-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.certificateProperties
+                    .subjectName
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_cert_subject')"
+                :tooltip="this.$t('message.crypto_cert_subject_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-cert-issuer-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.certificateProperties
+                    .issuerName
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_cert_issuer')"
+                :tooltip="this.$t('message.crypto_cert_issuer_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-cert-notValidBefore-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.certificateProperties
+                    .notValidBefore
+                "
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_cert_notValidBefore')"
+                :tooltip="this.$t('message.crypto_cert_notValidBefore_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-cert-notValidAfter-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.certificateProperties
+                    .notValidAfter
+                "
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_cert_notValidAfter')"
+                :tooltip="this.$t('message.crypto_cert_notValidAfter_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-cert-signAlgoRef-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.certificateProperties
+                    .signatureAlgorithmRef
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_cert_signAlgoRef')"
+                :tooltip="this.$t('message.crypto_cert_signAlgoRef_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-cert-subjPubKeyRef-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.certificateProperties
+                    .subjectPublicKeyRef
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_cert_subjPubKeyRef')"
+                :tooltip="this.$t('message.crypto_cert_subjPubKeyRef_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-cert-format-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.certificateProperties
+                    .certificateFormat
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_cert_format')"
+                :tooltip="this.$t('message.crypto_cert_format_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-cert-ext-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.certificateProperties
+                    .certificateExtension
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_cert_ext')"
+                :tooltip="this.$t('message.crypto_cert_ext_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+            </div>
+            <div
+              v-else-if="
+                component.cryptoAssetProperties.assetType ===
+                'related-crypto-material'
+              "
+            >
+              <b-input-group-form-select
+                id="component-rcm-type-input"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties.type
+                "
+                required="false"
+                :options="typeOptions"
+                :label="$t('message.crypto_rcm_type')"
+                :tooltip="$t('message.crypto_rcm_type_desc')"
+                :disabled="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-rcm-id-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .identifier
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_rcm_id')"
+                :tooltip="this.$t('message.crypto_rcm_id_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-select
+                id="component-rcm-state-input"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .state
+                "
+                required="false"
+                :options="stateOptions"
+                :label="$t('message.crypto_rcm_state')"
+                :tooltip="$t('message.crypto_rcm_state_desc')"
+                :disabled="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-rcm-algoRef-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .algorithmRef
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_rcm_algoRef')"
+                :tooltip="this.$t('message.crypto_rcm_algoRef_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-rcm-cdate-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .creationDate
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_rcm_cdate')"
+                :tooltip="this.$t('message.crypto_rcm_cdate_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-rcm-adate-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .activationDate
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_rcm_adate')"
+                :tooltip="this.$t('message.crypto_rcm_adate_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-rcm-udate-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .updateDate
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_rcm_udate')"
+                :tooltip="this.$t('message.crypto_rcm_udate_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-rcm-edate-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .expirationDate
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_rcm_edate')"
+                :tooltip="this.$t('message.crypto_rcm_edate_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-rcm-value-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .value
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_rcm_value')"
+                :tooltip="this.$t('message.crypto_rcm_value_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input-number
+                id="component-rcm-size-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  this.component.cryptoAssetProperties.relatedMaterialProperties
+                    .size
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_rcm_size')"
+                :tooltip="this.$t('message.crypto_rcm_size_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-rcm-format-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .format
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_rcm_format')"
+                :tooltip="this.$t('message.crypto_rcm_format_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-select
+                id="component-rcm-secByMech-input"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .securedBy.mechanism
+                "
+                required="false"
+                :options="mechanismOptions"
+                :label="$t('message.crypto_rcm_secByMech')"
+                :tooltip="$t('message.crypto_rcm_secByMech_desc')"
+                :disabled="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-rcm-secByAlgoRef-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.relatedMaterialProperties
+                    .securedBy.algorithmRef
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_rcm_secByAlgoRef')"
+                :tooltip="this.$t('message.crypto_rcm_secByAlgoRef_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+            </div>
+            <div
+              v-else-if="
+                component.cryptoAssetProperties.assetType === 'protocol'
+              "
+            >
+              <b-input-group-form-select
+                id="component-prot-type-input"
+                v-model="
+                  component.cryptoAssetProperties.protocolProperties.type
+                "
+                :options="protocolTypeOptions"
+                :label="$t('message.crypto_prot_type')"
+                :tooltip="this.$t('message.crypto_prot_type_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-prot-version-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="
+                  component.cryptoAssetProperties.protocolProperties.version
+                "
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_prot_version')"
+                :tooltip="this.$t('message.crypto_prot_version_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-prot-ciphersuites-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="this.cipherSuites"
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_prot_cipherSuites')"
+                :tooltip="$t('message.crypto_prot_cipherSuites_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-prot-ciphersuites-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="this.ikev2Encr"
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_prot_ikev2Encr')"
+                :tooltip="$t('message.crypto_prot_ikev2Encr_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-prot-ciphersuites-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="this.ikev2Prf"
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_prot_ikev2Prf')"
+                :tooltip="$t('message.crypto_prot_ikev2Prf_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-prot-ciphersuites-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="this.ikev2Integ"
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_prot_ikev2Integ')"
+                :tooltip="$t('message.crypto_prot_ikev2Integ_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-prot-ciphersuites-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="this.ikev2Ke"
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_prot_ikev2Ke')"
+                :tooltip="$t('message.crypto_prot_ikev2Ke_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-prot-ciphersuites-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="this.ikev2Esn"
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_prot_ikev2Esn')"
+                :tooltip="$t('message.crypto_prot_ikev2Esn_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <b-input-group-form-input
+                id="component-prot-ciphersuites-input"
+                input-group-size="mb-3"
+                type="text"
+                v-model="this.ikev2Auth"
+                lazy="true"
+                required="false"
+                feedback="true"
+                autofocus="false"
+                :label="$t('message.crypto_prot_ikev2Auth')"
+                :tooltip="$t('message.crypto_prot_ikev2Auth_desc')"
+                :readonly="
+                  this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)
+                "
+              />
+              <!--b-input-group-form-input
+              id="component-prot-cryptoRefs-input"
+              input-group-size="mb-3"
+              type="text"
+              v-model="component.cryptoAssetProperties.protocolProperties.cryptoRefs"
+              lazy="true"
+              required="false"
+              feedback="true"
+              autofocus="false"
+              :label="$t('message.crypto_prot_cryptoRefs')"
+              :tooltip="this.$t('message.crypto_prot_cryptoRefs_desc')"
+              :readonly="this.isNotPermitted(PERMISSIONS.PORTFOLIO_MANAGEMENT)"
+            /-->
+            </div>
+          </b-card>
+        </b-tab>
+      </div>
       <b-tab>
         <template v-slot:title
           ><i class="fa fa-balance-scale"></i>
@@ -500,7 +1231,9 @@
 
 <script>
 import BInputGroupFormInput from '../../../forms/BInputGroupFormInput';
+import BInputGroupFormInputNumber from '../../../forms/BInputGroupFormInputNumber';
 import BInputGroupFormSelect from '../../../forms/BInputGroupFormSelect';
+import BInputGroupFormSelectMultiple from '../../../forms/BInputGroupFormSelectMultiple';
 import ComponentPropertiesModal from './ComponentPropertiesModal.vue';
 import permissionsMixin from '../../../mixins/permissionsMixin';
 import xssFilters from 'xss-filters';
@@ -511,7 +1244,9 @@ export default {
   mixins: [permissionsMixin],
   components: {
     BInputGroupFormInput,
+    BInputGroupFormInputNumber,
     BInputGroupFormSelect,
+    BInputGroupFormSelectMultiple,
     ComponentPropertiesModal,
   },
   props: {
@@ -540,6 +1275,209 @@ export default {
         { value: 'DEVICE', text: this.$i18n.t('message.component_device') },
         { value: 'FIRMWARE', text: this.$i18n.t('message.component_firmware') },
         { value: 'FILE', text: this.$i18n.t('message.component_file') },
+        {
+          value: 'CRYPTOGRAPHIC_ASSET',
+          text: this.$i18n.t('message.component_cryptographic_asset'),
+        },
+      ],
+      assetTypeOptions: [
+        { value: 'algorithm', text: 'Algorithm' },
+        { value: 'certificate', text: 'Certificate' },
+        { value: 'related-crypto-material', text: 'Related Crypto Material' },
+        { value: 'protocol', text: 'Protocol' },
+      ],
+      primitiveOptions: [
+        { value: 'drbg', text: 'Deterministic Random Bit Generator' },
+        { value: 'mac', text: 'Message Authentication Code' },
+        { value: 'block-cipher', text: 'Block Cipher' },
+        { value: 'stream-cipher', text: 'Stream Cipher' },
+        { value: 'signature', text: 'Signature' },
+        { value: 'hash', text: 'Hash' },
+        { value: 'pke', text: 'Public Key Encryption' },
+        { value: 'xof', text: 'XOF' },
+        { value: 'kdf', text: 'Key Derivation Function' },
+        { value: 'key-agree', text: 'Key Agreement' },
+        { value: 'kem', text: 'Key Encapsulation Mechanism' },
+        { value: 'ae', text: 'Authenticated Encryption' },
+        { value: 'other', text: 'Other' },
+      ],
+      execEnvOptions: [
+        { value: 'software-plain-ram', text: 'Plain RAM Software' },
+        { value: 'software-encrypted-ram', text: 'Encrypted RAM Software' },
+        {
+          value: 'software-tee',
+          text: 'Software in Trusted Execution Environment',
+        },
+        { value: 'hardware', text: 'Hardware' },
+        { value: 'other', text: 'Other' },
+      ],
+      implPflmOptions: [
+        { value: 'generic', text: 'generic' },
+        { value: 'x86_32', text: 'x86_32' },
+        { value: 'x86_64', text: 'X86_64' },
+        { value: 'armv7-a', text: 'armv7-a' },
+        { value: 'armv7-m', text: 'armv7-m' },
+        { value: 'armv8-a', text: 'armv8-a' },
+        { value: 'armv8-m', text: 'armv8-m' },
+        { value: 'armv9-a', text: 'armv9-a' },
+        { value: 'armv9-m', text: 'armv9-m' },
+        { value: 's390x', text: 's390x' },
+        { value: 'ppc64', text: 'ppc64' },
+        { value: 'ppc64le', text: 'ppc64le' },
+        { value: 'other', text: 'Other' },
+      ],
+      certLvlOptions: [
+        { value: 'none', text: 'None' },
+        { value: 'fips140-1-l1', text: 'FIPS 140-1 Level 1' },
+        { value: 'fips140-1-l2', text: 'FIPS 140-1 Level 2' },
+        { value: 'fips140-1-l3', text: 'FIPS 140-1 Level 3' },
+        { value: 'fips140-1-l4', text: 'FIPS 140-1 Level 4' },
+        { value: 'fips140-2-l1', text: 'FIPS 140-2 Level 1' },
+        { value: 'fips140-2-l2', text: 'FIPS 140-2 Level 2' },
+        { value: 'fips140-2-l3', text: 'FIPS 140-2 Level 3' },
+        { value: 'fips140-2-l4', text: 'FIPS 140-2 Level 4' },
+        { value: 'fips140-3-l1', text: 'FIPS 140-3 Level 1' },
+        { value: 'fips140-3-l2', text: 'FIPS 140-3 Level 2' },
+        { value: 'fips140-3-l3', text: 'FIPS 140-3 Level 3' },
+        { value: 'fips140-3-l4', text: 'FIPS 140-3 Level 4' },
+        {
+          value: 'cc-eal1',
+          text: 'Common Criteria - Evaluation Assurance Level 1',
+        },
+        {
+          value: 'cc-eal1+',
+          text: 'Common Criteria - Evaluation Assurance Level 1 (Augmented)',
+        },
+        {
+          value: 'cc-eal2',
+          text: 'Common Criteria - Evaluation Assurance Level 2',
+        },
+        {
+          value: 'cc-eal2+',
+          text: 'Common Criteria - Evaluation Assurance Level 2 (Augmented)',
+        },
+        {
+          value: 'cc-eal3',
+          text: 'Common Criteria - Evaluation Assurance Level 3',
+        },
+        {
+          value: 'cc-eal3+',
+          text: 'Common Criteria - Evaluation Assurance Level 3 (Augmented)',
+        },
+        {
+          value: 'cc-eal4',
+          text: 'Common Criteria - Evaluation Assurance Level 4',
+        },
+        {
+          value: 'cc-eal4+',
+          text: 'Common Criteria - Evaluation Assurance Level 4 (Augmented)',
+        },
+        {
+          value: 'cc-eal5',
+          text: 'Common Criteria - Evaluation Assurance Level 5',
+        },
+        {
+          value: 'cc-eal5+',
+          text: 'Common Criteria - Evaluation Assurance Level 5 (Augmented)',
+        },
+        {
+          value: 'cc-eal6',
+          text: 'Common Criteria - Evaluation Assurance Level 6',
+        },
+        {
+          value: 'cc-eal6+',
+          text: 'Common Criteria - Evaluation Assurance Level 6 (Augmented)',
+        },
+        {
+          value: 'cc-eal7',
+          text: 'Common Criteria - Evaluation Assurance Level 7',
+        },
+        {
+          value: 'cc-eal7+',
+          text: 'Common Criteria - Evaluation Assurance Level 7 (Augmented)',
+        },
+        { value: 'other', text: 'Other' },
+      ],
+      modeOptions: [
+        { value: 'cbc', text: 'Cipher Block Chaining' },
+        { value: 'ecb', text: 'Electronic Codebook' },
+        { value: 'gcm', text: 'Galois/counter' },
+        { value: 'ofb', text: 'Output Feedback' },
+        { value: 'ctr', text: 'Counter' },
+        { value: 'other', text: 'Other' },
+      ],
+      paddingOptions: [
+        {
+          value: 'pkcs5',
+          text: 'Public Key Cryptography Standard: Password-Based Cryptography',
+        },
+        {
+          value: 'pkcs7',
+          text: 'Public Key Cryptography Standard: Cryptographic Message Syntax',
+        },
+        {
+          value: 'pkcs1v15',
+          text: 'Public Key Cryptography Standard: RSA Cryptography v1.5r',
+        },
+        { value: 'oaep', text: 'Optimal Asymmetric Encryption Padding' },
+        { value: 'raw', text: 'Raw' },
+        { value: 'other', text: 'Other' },
+      ],
+      cryptoFunctionOptions: [
+        { value: 'generate', text: 'generate' },
+        { value: 'keygen', text: 'keygen' },
+        { value: 'encrypt', text: 'encrypt' },
+        { value: 'decrypt', text: 'decrypt' },
+        { value: 'digest', text: 'digest' },
+        { value: 'tag', text: 'tag' },
+        { value: 'keyderive', text: 'keyderive' },
+        { value: 'sign', text: 'sign' },
+        { value: 'verify', text: 'verify' },
+        { value: 'encapsulate', text: 'encapsulate' },
+        { value: 'decapsulate', text: 'decapsulate' },
+        { value: 'other', text: 'Other' },
+      ],
+      typeOptions: [
+        { value: 'private_key', text: 'Private Key (asymmetric)' },
+        { value: 'public-key', text: 'Public Key (asymmetric)' },
+        { value: 'secret-key', text: 'Secret Key (symmetric)' },
+        { value: 'key', text: 'Key' },
+        { value: 'ciphertext', text: 'Ciphertext' },
+        { value: 'signature', text: 'Signature' },
+        { value: 'digest', text: 'Digest' },
+        { value: 'initialization-vector', text: 'Initialization Vector' },
+        { value: 'seed', text: 'Seed' },
+        { value: 'salt', text: 'Salt' },
+        { value: 'shared-secret', text: 'Shared Secret' },
+        { value: 'tag', text: 'Authentication Tag' },
+        { value: 'additional-data', text: 'Additional Data' },
+        { value: 'password', text: 'Password' },
+        { value: 'credential', text: 'Credential' },
+        { value: 'token', text: 'Token' },
+        { value: 'other', text: 'Other' },
+      ],
+      stateOptions: [
+        { value: 'pre-activation', text: 'pre-activation' },
+        { value: 'active', text: 'active' },
+        { value: 'suspended', text: 'suspended' },
+        { value: 'deactivated', text: 'deactivated' },
+        { value: 'compromised', text: 'compromised' },
+        { value: 'destroyed', text: 'destroyed' },
+      ],
+      mechanismOptions: [
+        { value: 'HSM', text: 'Hardware Secirity Module' },
+        { value: 'TPM', text: 'Trusted Platform Module' },
+        { value: 'SGX', text: 'Software Guard Extensions' },
+        { value: 'Software', text: 'Software' },
+      ],
+      protocolTypeOptions: [
+        { value: 'tls', text: 'Transport Layer Security' },
+        { value: 'ssh', text: 'Secure Shell' },
+        { value: 'ipsec', text: 'Internet Protocol Security' },
+        { value: 'ike', text: 'Internet Key Exchange' },
+        { value: 'sstp', text: 'Secure Socket Tunneling Protocol' },
+        { value: 'wpa', text: 'Wi-Fi Protected Access' },
+        { value: 'other', text: 'Other' },
       ],
       selectableLicenses: [],
       selectedLicense: '',
@@ -671,6 +1609,36 @@ export default {
   },
   beforeUpdate() {
     //console.log(this.component);
+    if (
+      this.component.hasOwnProperty('cryptoAssetProperties') &&
+      this.component.cryptoAssetProperties.hasOwnProperty('protocolProperties')
+    ) {
+      let pp = this.component.cryptoAssetProperties.protocolProperties;
+      if (pp.hasOwnProperty('cipherSuites')) {
+        this.cipherSuites = pp.cipherSuites.map((a) => a.name).join(', ');
+      }
+
+      if (pp.hasOwnProperty('ikev2Types')) {
+        if (pp.ikev2Types.hasOwnProperty('encr')) {
+          this.ikev2Encr = pp.ikev2Types.encr.join(', ');
+        }
+        if (pp.ikev2Types.hasOwnProperty('prf')) {
+          this.ikev2Prf = pp.ikev2Types.prf.join(', ');
+        }
+        if (pp.ikev2Types.hasOwnProperty('integ')) {
+          this.ikev2Integ = pp.ikev2Types.integ.join(', ');
+        }
+        if (pp.ikev2Types.hasOwnProperty('ke')) {
+          this.ikev2Ke = pp.ikev2Types.ke.join(', ');
+        }
+        if (pp.ikev2Types.hasOwnProperty('esn')) {
+          this.ikev2Esn = pp.ikev2Types.esn.join(', ');
+        }
+        if (pp.ikev2Types.hasOwnProperty('auth')) {
+          this.ikev2Auth = pp.ikev2Types.auth.join(', ');
+        }
+      }
+    }
   },
   methods: {
     updateComponent: function () {
diff --git a/src/views/portfolio/projects/CryptoAsset.vue b/src/views/portfolio/projects/CryptoAsset.vue
new file mode 100644
index 00000000..d8890a7a
--- /dev/null
+++ b/src/views/portfolio/projects/CryptoAsset.vue
@@ -0,0 +1,104 @@
+<template>
+  <div class="animated fadeIn" v-permission="PERMISSIONS.VIEW_PORTFOLIO">
+    <b-card :no-body="true" footer-class="px-3 py-2 card-footer-action">
+      <b-card-body class="p-3 clearfix">
+        <b-row>
+          <b-col>
+            <i class="fa fa-lock bg-primary p-3 font-2xl mr-3 float-left"></i>
+            <div class="h5 mb-0 mt-2">{{ cryptoAssetLabel }}</div>
+          </b-col>
+        </b-row>
+      </b-card-body>
+      <div id="component-info-footer" slot="footer">
+        <b-link
+          class="font-weight-bold font-xs btn-block text-muted"
+          v-b-modal.componentDetailsModal
+          >{{ $t('message.view_details') }}
+          <i class="fa fa-angle-right float-right font-lg"></i
+        ></b-link>
+      </div>
+    </b-card>
+    <b-tabs
+      class="body-bg-color"
+      style="border-left: 0; border-right: 0; border-top: 0"
+    >
+      <b-tab
+        class="body-bg-color"
+        style="border-left: 0; border-right: 0; border-top: 0; padding: 0"
+        active
+      >
+        <template v-slot:title
+          ><i class="fa fa-line-chart"></i>
+          {{ $t('message.overview') }}</template
+        >
+        <crypto-asset-overview
+          :key="this.uuid"
+          :uuid="this.uuid"
+          :cryptoAsset="this.cryptoAsset"
+        />
+      </b-tab>
+    </b-tabs>
+  </div>
+</template>
+
+<script>
+import EventBus from '@/shared/eventbus';
+import permissionsMixin from '@/mixins/permissionsMixin';
+
+export default {
+  mixins: [permissionsMixin],
+  name: 'CryptoAsset',
+  title: '',
+  computed: {
+    projectLabel() {
+      if (this.cryptoAsset.hasOwnProperty('project')) {
+        if (this.cryptoAsset.project.name && this.cryptoAsset.project.version) {
+          return (
+            this.cryptoAsset.project.name +
+            ' ▸ ' +
+            this.cryptoAsset.project.version
+          );
+        } else {
+          return this.cryptoAsset.project.name;
+        }
+      }
+    },
+    cryptoAssetLabel() {
+      if (this.cryptoAsset.name && this.cryptoAsset.version) {
+        return this.cryptoAsset.name + ' ▸ ' + this.cryptoAsset.version;
+      } else {
+        return this.cryptoAsset.name;
+      }
+    },
+  },
+
+  data() {
+    return {
+      cryptoAsset: {},
+      uuid: null,
+    };
+  },
+  beforeMount() {
+    this.uuid = this.$route.params.uuid;
+  },
+  mounted() {
+    let cryptoAssetUrl = `${this.$api.BASE_URL}/${this.$api.URL_CRYPTO_ASSET}/${this.uuid}`;
+    this.axios.get(cryptoAssetUrl).then((response) => {
+      this.cryptoAsset = response.data;
+      EventBus.$emit(
+        'addCrumb',
+        this.cryptoAssetLabel,
+        'Project',
+        this.cryptoAsset.project.uuid,
+        this.projectLabel,
+      );
+      this.$title = this.cryptoAssetLabel;
+    });
+  },
+  destroyed() {
+    EventBus.$emit('crumble');
+  },
+};
+</script>
+
+<style scoped></style>
diff --git a/src/views/portfolio/projects/ProjectAddComponentModal.vue b/src/views/portfolio/projects/ProjectAddComponentModal.vue
index 46a71159..0170df4b 100644
--- a/src/views/portfolio/projects/ProjectAddComponentModal.vue
+++ b/src/views/portfolio/projects/ProjectAddComponentModal.vue
@@ -293,6 +293,10 @@ export default {
         { value: 'DEVICE', text: this.$i18n.t('message.component_device') },
         { value: 'FIRMWARE', text: this.$i18n.t('message.component_firmware') },
         { value: 'FILE', text: this.$i18n.t('message.component_file') },
+        {
+          value: 'CRYPTOGRAPHIC_ASSET',
+          text: this.$i18n.t('message.component_cryptographic_asset'),
+        },
       ],
       selectableLicenses: [],
       selectedLicense: '',
@@ -370,8 +374,7 @@ export default {
         .then((response) => {
           // Allow for license to be un-selected.
           this.selectableLicenses.push({ value: '', text: '' });
-          for (let i = 0; i < response.data.length; i++) {
-            let license = response.data[i];
+          for (const license of response.data) {
             this.selectableLicenses.push({
               value: license.licenseId,
               text: license.name,
diff --git a/src/views/portfolio/projects/ProjectCreateProjectModal.vue b/src/views/portfolio/projects/ProjectCreateProjectModal.vue
index 3346af88..50ea3176 100644
--- a/src/views/portfolio/projects/ProjectCreateProjectModal.vue
+++ b/src/views/portfolio/projects/ProjectCreateProjectModal.vue
@@ -237,6 +237,10 @@ export default {
         { value: 'DEVICE', text: this.$i18n.t('message.component_device') },
         { value: 'FIRMWARE', text: this.$i18n.t('message.component_firmware') },
         { value: 'FILE', text: this.$i18n.t('message.component_file') },
+        {
+          value: 'CRYPTOGRAPHIC_ASSET',
+          text: this.$i18n.t('message.component_cryptographic_asset'),
+        },
       ],
       selectableLicenses: [],
       selectedLicense: '',
@@ -330,8 +334,7 @@ export default {
         this.axios
           .get(url)
           .then((response) => {
-            for (let i = 0; i < response.data.length; i++) {
-              let license = response.data[i];
+            for (const license of response.data) {
               this.selectableLicenses.push({
                 value: license.licenseId,
                 text: license.name,
diff --git a/src/views/portfolio/projects/ProjectCryptoAssets.vue b/src/views/portfolio/projects/ProjectCryptoAssets.vue
new file mode 100644
index 00000000..5b3f7d39
--- /dev/null
+++ b/src/views/portfolio/projects/ProjectCryptoAssets.vue
@@ -0,0 +1,274 @@
+<template>
+  <div>
+    <div id="cbomToolbar">
+      <div class="form-inline btn-spaced-group" role="form">
+        <b-button
+          size="md"
+          variant="outline-primary"
+          v-b-modal.projectAddComponentModal
+          v-permission="PERMISSIONS.PORTFOLIO_MANAGEMENT"
+        >
+          <span class="fa fa-plus"></span> {{ $t('message.add_cryptoAsset') }}
+        </b-button>
+        <b-button
+          size="md"
+          variant="outline-primary"
+          @click="removeDependencies"
+          v-permission="PERMISSIONS.PORTFOLIO_MANAGEMENT"
+        >
+          <span class="fa fa-minus"></span>
+          {{ $t('message.remove_cryptoAsset') }}
+        </b-button>
+        <b-button
+          size="md"
+          variant="outline-primary"
+          v-b-modal.projectUploadBomModal
+          v-permission:or="[
+            PERMISSIONS.PORTFOLIO_MANAGEMENT,
+            PERMISSIONS.BOM_UPLOAD,
+          ]"
+        >
+          <span class="fa fa-upload"></span> {{ $t('message.upload_cbom') }}
+        </b-button>
+        <b-dropdown
+          variant="outline-primary"
+          v-permission="PERMISSIONS.PORTFOLIO_MANAGEMENT"
+        >
+          <template #button-content>
+            <span class="fa fa-download"></span>
+            {{ $t('message.download_cbom') }}
+          </template>
+          <b-dropdown-item @click="downloadCbom('cbom')" href="#">{{
+            $t('message.inventory')
+          }}</b-dropdown-item>
+          <b-dropdown-item
+            @click="downloadCbom('cbom_withVulnerabilities')"
+            href="#"
+            >{{ $t('message.inventory_with_vulnerabilities') }}</b-dropdown-item
+          >
+        </b-dropdown>
+      </div>
+    </div>
+    <bootstrap-table
+      ref="table"
+      :columns="columns"
+      :data="data"
+      :options="options"
+      @on-load-success="tableLoaded"
+    >
+    </bootstrap-table>
+  </div>
+</template>
+
+<script>
+import $ from 'jquery';
+import common from '../../../shared/common';
+import xssFilters from 'xss-filters';
+import permissionsMixin from '../../../mixins/permissionsMixin';
+
+export default {
+  mixins: [permissionsMixin],
+  props: {
+    uuid: String,
+  },
+  data() {
+    return {
+      columns: [
+        {
+          field: 'state',
+          checkbox: true,
+          align: 'center',
+        },
+        {
+          title: this.$t('message.crypto_assets'),
+          field: 'name',
+          sortable: true,
+          formatter(value, row, index) {
+            let url = xssFilters.uriInUnQuotedAttr(
+              '../../../components/' + row.uuid,
+            );
+            return `<a href="${url}">${xssFilters.inHTMLData(value)}</a>`;
+          },
+        },
+        {
+          title: this.$t('message.version'),
+          field: 'version',
+          sortable: true,
+          formatter(value, row, index) {
+            if (
+              Object.prototype.hasOwnProperty.call(row, 'repositoryMeta') &&
+              Object.prototype.hasOwnProperty.call(
+                row.repositoryMeta,
+                'latestVersion',
+              )
+            ) {
+              row.latestVersion = row.repositoryMeta.latestVersion;
+              if (row.repositoryMeta.latestVersion !== row.version) {
+                return (
+                  '<span style="float:right" data-toggle="tooltip" data-placement="bottom" title="Risk: Outdated component. Current version is: ' +
+                  xssFilters.inHTMLData(row.repositoryMeta.latestVersion) +
+                  '"><i class="fa fa-exclamation-triangle status-warning" aria-hidden="true"></i></span> ' +
+                  xssFilters.inHTMLData(row.version)
+                );
+              } else {
+                return (
+                  '<span style="float:right" data-toggle="tooltip" data-placement="bottom" title="Component version is the latest available from the configured repositories"><i class="fa fa-exclamation-triangle status-passed" aria-hidden="true"></i></span> ' +
+                  xssFilters.inHTMLData(row.version)
+                );
+              }
+            } else {
+              return xssFilters.inHTMLData(common.valueWithDefault(value, ''));
+            }
+          },
+        },
+        {
+          title: this.$t('message.latest_version'),
+          field: 'latestVersion',
+          sortable: false,
+          visible: false,
+          formatter(value, row, index) {
+            return xssFilters.inHTMLData(common.valueWithDefault(value, ''));
+          },
+        },
+        {
+          title: this.$t('message.crypto_assetType'),
+          field: 'cryptoAssetProperties.assetType',
+          sortable: true,
+          formatter(value, row, index) {
+            if (typeof value === 'undefined') {
+              return '-'; // No primitive info available
+            }
+            return xssFilters.inHTMLData(common.valueWithDefault(value, ''));
+          },
+        },
+        {
+          title: this.$t('message.crypto_oid'),
+          field: 'cryptoAssetProperties.oid',
+          sortable: true,
+          formatter(value, row, index) {
+            if (typeof value === 'undefined') {
+              return '-'; // No primitive info available
+            }
+            return xssFilters.inHTMLData(value);
+          },
+        },
+        {
+          title: this.$t('message.crypto_algo_primitive'),
+          field: 'cryptoAssetProperties.primitive',
+          sortable: true,
+          formatter(value, row, index) {
+            if (typeof value === 'undefined') {
+              return '-'; // No primitive info available
+            }
+            return xssFilters.inHTMLData(common.valueWithDefault(value, ''));
+          },
+        },
+        {
+          title: this.$t('message.crypto_quantumSecurityLevel'),
+          field: 'cryptoAssetProperties.quantumSecurityLevel',
+          sortable: true,
+          class: 'tight',
+        },
+        {
+          title: this.$t('message.crypto_classicalSecurityLevel'),
+          field: 'cryptoAssetProperties.classicalSecurityLevel',
+          sortable: true,
+          class: 'tight',
+        },
+        {
+          title: this.$t('message.crypto_nistQscLevel'),
+          field: 'cryptoAssetProperties.nistQscLevel',
+          sortable: true,
+        },
+      ],
+      data: [],
+      options: {
+        onPostBody: this.initializeTooltips,
+        search: true,
+        showColumns: true,
+        showRefresh: true,
+        pagination: true,
+        silentSort: false,
+        sidePagination: 'server',
+        toolbar: '#cbomToolbar',
+        queryParamsType: 'pageSize',
+        pageList: '[10, 25, 50, 100]',
+        pageSize: 10,
+        icons: {
+          refresh: 'fa-refresh',
+        },
+        responseHandler: function (res, xhr) {
+          res.total = xhr.getResponseHeader('X-Total-Count');
+          return res;
+        },
+        url: `${this.$api.BASE_URL}/api/v1/crypto/project/${this.uuid}`,
+      },
+    };
+  },
+  methods: {
+    initializeTooltips: function () {
+      $('[data-toggle="tooltip"]').tooltip();
+    },
+    removeDependencies: function () {
+      let selections = this.$refs.table.getSelections();
+      if (selections.length === 0) return;
+      for (let i = 0; i < selections.length; i++) {
+        let url = `${this.$api.BASE_URL}/${this.$api.URL_CRYPTO_ASSET}/${selections[i].uuid}`;
+        this.axios
+          .delete(url)
+          .then((response) => {
+            this.$refs.table.refresh({ silent: true });
+            this.$toastr.s(this.$t('message.cryptoAsset_deleted'));
+          })
+          .catch((error) => {
+            this.$toastr.w(this.$t('condition.unsuccessful_action'));
+          });
+      }
+      this.$refs.table.uncheckAll();
+    },
+    downloadCbom: function (data) {
+      let url = `${this.$api.BASE_URL}/${this.$api.URL_BOM}/cyclonedx/project/${this.uuid}`;
+      this.axios
+        .request({
+          responseType: 'blob',
+          url: url,
+          method: 'get',
+          params: {
+            format: 'json',
+            variant: data,
+            download: 'true',
+          },
+        })
+        .then((response) => {
+          const url = window.URL.createObjectURL(new Blob([response.data]));
+          const link = document.createElement('a');
+          link.href = url;
+          let filename = 'bom.json';
+          let disposition = response.headers['content-disposition'];
+          if (disposition && disposition.indexOf('attachment') !== -1) {
+            let filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
+            let matches = filenameRegex.exec(disposition);
+            if (matches != null && matches[1]) {
+              filename = matches[1].replace(/['"]/g, '');
+            }
+          }
+          link.setAttribute('download', filename);
+          document.body.appendChild(link);
+          link.click();
+        });
+    },
+    tableLoaded: function (data) {
+      if (data && Object.prototype.hasOwnProperty.call(data, 'total')) {
+        this.$emit('total', data.total);
+      } else {
+        this.$emit('total', '?');
+      }
+    },
+    refreshTable: function () {
+      this.$refs.table.refresh({
+        silent: true,
+      });
+    },
+  },
+};
+</script>