diff --git a/pkg/sbombastic-image-vulnerability-scanner/components/TopSevereVulnerabilitiesChart.vue b/pkg/sbombastic-image-vulnerability-scanner/components/TopSevereVulnerabilitiesChart.vue
index 60f5c95..7a8aa49 100644
--- a/pkg/sbombastic-image-vulnerability-scanner/components/TopSevereVulnerabilitiesChart.vue
+++ b/pkg/sbombastic-image-vulnerability-scanner/components/TopSevereVulnerabilitiesChart.vue
@@ -7,7 +7,6 @@
       <SevereVulnerabilitiesItem 
         v-for="vulnerability in topSevereVulnerabilities"
         :vulnerability="vulnerability"
-        :total="totalVulnerabilities"
       />
     </div>
   </div>
@@ -26,10 +25,6 @@
         type: Array,
         required: true
       },
-      totalVulnerabilities: {
-        type: Number,
-        required: true
-      }
     },
     data() {}
   }
diff --git a/pkg/sbombastic-image-vulnerability-scanner/components/common/ScoreBadge.vue b/pkg/sbombastic-image-vulnerability-scanner/components/common/ScoreBadge.vue
index 8933468..b2f837d 100644
--- a/pkg/sbombastic-image-vulnerability-scanner/components/common/ScoreBadge.vue
+++ b/pkg/sbombastic-image-vulnerability-scanner/components/common/ScoreBadge.vue
@@ -10,12 +10,12 @@
     name: 'scoreBadge',
     props: {
       score:{
-        type: Number,
-        default: 0
+        type: String,
+        default: ''
       },
       scoreType: {
         type: String,
-        default: ""
+        default: ''
       }
     },
     computed: {
diff --git a/pkg/sbombastic-image-vulnerability-scanner/components/common/SevereVulnerabilitiesItem.vue b/pkg/sbombastic-image-vulnerability-scanner/components/common/SevereVulnerabilitiesItem.vue
index 2fe6117..c2c5725 100644
--- a/pkg/sbombastic-image-vulnerability-scanner/components/common/SevereVulnerabilitiesItem.vue
+++ b/pkg/sbombastic-image-vulnerability-scanner/components/common/SevereVulnerabilitiesItem.vue
@@ -1,15 +1,15 @@
 <template>
     <div class="vulnerability-record">
       <div class="cve">
-        {{ vulnerability.cve }}
+        {{ vulnerability.metadata.name }}
       </div>
-      <ScoreBadge :score="vulnerability.scoreV3" scoreType="v3" />
+      <ScoreBadge :score="vulnerability.spec.scoreV3" scoreType="v3" />
       <div class="impacted-container">
         <div class="impacted">
-          <span>{{ vulnerability.impactedImages }}</span>
+          <span>{{ vulnerability.spec.impactedImages }}</span>
           <BlockPercentageBar
             class="percentage-bar"
-            :percentage="(vulnerability.impactedImages / total) * 100"
+            :percentage="(vulnerability.spec.impactedImages / vulnerability.spec.totalImages) * 100"
           />
         </div>
       </div>
@@ -31,10 +31,6 @@
         type: Object,
         required: true
       },
-      total: {
-        type: Number,
-        required: true
-      }
     },
     data() {
       return { };
diff --git a/pkg/sbombastic-image-vulnerability-scanner/config/table-headers.ts b/pkg/sbombastic-image-vulnerability-scanner/config/table-headers.ts
index 0ae0298..4f3c0f9 100644
--- a/pkg/sbombastic-image-vulnerability-scanner/config/table-headers.ts
+++ b/pkg/sbombastic-image-vulnerability-scanner/config/table-headers.ts
@@ -173,7 +173,7 @@ export const IMAGE_LIST_TABLE = [
     labelKey: "imageScanner.images.listTable.headers.registry",
     value: "spec.registry",
     sort: "spec.registry",
-  }
+  },
 ];
 
 export const REPO_BASED_TABLE = [
@@ -230,3 +230,46 @@ export const REPO_BASED_IMAGE_LIST_TABLE = [
     width: 450,
   },
 ];
+
+export const VULNERABILITIES_TABLE = [
+  {
+    name: "cve",
+    labelKey: "imageScanner.vulnerabilities.table.headers.cve",
+    value: "metadata.name",
+    sort: "metadata.name",
+    width: 140,
+  },
+  {
+    name: "score",
+    labelKey: "imageScanner.vulnerabilities.table.headers.score",
+    value: "spec.scoreV3",
+    formatter: "ScoreBadgeCell",
+    sort: "spec.scoreV3",
+    width: 100,
+  },
+  {
+    name: "affectedImages",
+    labelKey: "imageScanner.vulnerabilities.table.headers.affectedImages",
+    value: "spec.impactedImages",
+    formatter: "ImpactedCell",
+    formatterParams: { ticks: 23 },
+    sort: "spec.impactedImages",
+    width: 200,
+  },
+  {
+    name: "severity",
+    labelKey: "imageScanner.vulnerabilities.table.headers.severity",
+    value: "spec.severity",
+    sort: "spec.severity",
+    width: 120,
+  },
+  {
+    name: "identifiedImages",
+    labelKey: "imageScanner.vulnerabilities.table.headers.identifiedImages",
+    value: "spec.identifiedImages",
+    formatter: "ImpactedCell",
+    formatterParams: { ticks: 45 },
+    sort: "spec.identifiedImages",
+    width: 300,
+  },
+];
diff --git a/pkg/sbombastic-image-vulnerability-scanner/data/sbombastic.rancher.io.vulnerability.js b/pkg/sbombastic-image-vulnerability-scanner/data/sbombastic.rancher.io.vulnerability.js
new file mode 100644
index 0000000..b742ec4
--- /dev/null
+++ b/pkg/sbombastic-image-vulnerability-scanner/data/sbombastic.rancher.io.vulnerability.js
@@ -0,0 +1,142 @@
+export const severityDistribution = {
+  critical: 120,
+  high: 54,
+  medium: 23,
+  low: 65,
+  none: 200,
+};
+
+export const cves = [
+  {
+    id: 'CVE-2017-5337',
+    metadata: {
+      name: 'CVE-2017-5337',
+    },
+    spec: {
+      scoreV3: '9.9',
+      severity: 'Critical',
+      identifiedImages: 106,
+      impactedImages: 103,
+    }
+  },
+  {
+    id: 'CVE-2017-5336',
+    metadata: {
+      name: 'CVE-2017-5336',
+    },
+    spec: {
+      scoreV3: '9.6',
+      severity: 'Critical',
+      identifiedImages: 234,
+      impactedImages: 98,
+    }
+  },
+  {
+    id: 'CVE-2017-5335',
+    metadata: {
+      name: 'CVE-2017-5335',
+    },
+    spec: {
+      scoreV3: '8.8',
+      severity: 'High',
+      identifiedImages: 321,
+      impactedImages: 95,
+    }
+  },
+  {
+    id: 'CVE-2017-5334',
+    metadata: {
+      name: 'CVE-2017-5334',
+    },
+    spec: {
+      scoreV3: '8.6',
+      severity: 'High',
+      identifiedImages: 450,
+      impactedImages: 92,
+    }
+  },
+  {
+    id: 'CVE-2017-5333',
+    metadata: {
+      name: 'CVE-2017-5333',
+    },
+    spec: {
+      scoreV3: '8.5',
+      severity: 'High',
+      identifiedImages: 300,
+      impactedImages: 90,
+    }
+  },
+  {
+    id: 'CVE-2017-5332',
+    metadata: {
+      name: 'CVE-2017-5332',
+    },
+    spec: {
+      scoreV3: '7.5',
+      severity: 'Medium',
+      identifiedImages: 250,
+      impactedImages: 85,
+    }
+  },
+  {
+    id: 'CVE-2017-5331',
+    metadata: {
+      name: 'CVE-2017-5331',
+    },
+    spec: {
+      scoreV3: '7.2',
+      severity: 'Medium',
+      identifiedImages: 200,
+      impactedImages: 80,
+    }
+  },
+  {
+    id: 'CVE-2017-5330',
+    metadata: {
+      name: 'CVE-2017-5330',
+    },
+    spec: {
+      scoreV3: '6.8',
+      severity: 'Medium',
+      identifiedImages: 150,
+      impactedImages: 75,
+    }
+  },
+  {
+    id: 'CVE-2017-5329',
+    metadata: {
+      name: 'CVE-2017-5329',
+    },
+    spec: {
+      scoreV3: '5.5',
+      severity: 'Low',
+      identifiedImages: 100,
+      impactedImages: 70,
+    }
+  },
+  {
+    id: 'CVE-2017-5328',
+    metadata: {
+      name: 'CVE-2017-5328',
+    },
+    spec: {
+      scoreV3: '4.3',
+      severity: 'Low',
+      identifiedImages: 50,
+      impactedImages: 65,
+    }
+  },
+  {
+    id: 'CVE-2024-12345',
+    metadata: {
+      name: 'CVE-2024-12345',
+    },
+    spec: {
+      scoreV3: '9.8',
+      severity: 'Critical',
+      identifiedImages: 150,
+      impactedImages: 145,
+    }
+  }
+];
\ No newline at end of file
diff --git a/pkg/sbombastic-image-vulnerability-scanner/formatters/ImpactedCell.vue b/pkg/sbombastic-image-vulnerability-scanner/formatters/ImpactedCell.vue
new file mode 100644
index 0000000..d0643c4
--- /dev/null
+++ b/pkg/sbombastic-image-vulnerability-scanner/formatters/ImpactedCell.vue
@@ -0,0 +1,53 @@
+<template>
+  <div class="impacted-container">
+    <div class="impacted">
+      <span>{{ value }}</span>
+      <BlockPercentageBarAlt
+        :ticks="col.formatterParams?.ticks || 10"
+        :percentage="(row.spec.totalImages && value) ? (value / row.spec.totalImages) * 100 : 0"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+  import BlockPercentageBarAlt from '@sbombastic-image-vulnerability-scanner/components/common/BlockPercentageBarAlt.vue';
+
+  export default {
+    components: {
+      BlockPercentageBarAlt
+    },
+    props: {
+      value: {
+        type: Number,
+        required: true
+      },
+      row: {
+        type: Object,
+        required: true
+      },
+      col: {
+        type: Object,
+        required: true
+      }
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .impacted-container {
+    display: flex;
+    padding: 0 16px;
+    align-items: center;
+    justify-content: end;
+  }
+
+  .impacted {
+    display: flex;
+    align-items: center;
+    justify-content: end;
+    gap: 16px;
+    flex: 1 0 0;
+    align-self: stretch;
+  }
+</style>
\ No newline at end of file
diff --git a/pkg/sbombastic-image-vulnerability-scanner/formatters/ScoreBadgeCell.vue b/pkg/sbombastic-image-vulnerability-scanner/formatters/ScoreBadgeCell.vue
new file mode 100644
index 0000000..b59db42
--- /dev/null
+++ b/pkg/sbombastic-image-vulnerability-scanner/formatters/ScoreBadgeCell.vue
@@ -0,0 +1,19 @@
+<template>
+  <ScoreBadge :score="value" scoreType="v3" />
+</template>
+
+<script>
+  import ScoreBadge from '@sbombastic-image-vulnerability-scanner/components/common/ScoreBadge.vue';
+
+  export default {
+    components: {
+      ScoreBadge
+    },
+    props: {
+      value: {
+        type: String,
+        required: true
+      }
+    },
+  };
+</script>
\ No newline at end of file
diff --git a/pkg/sbombastic-image-vulnerability-scanner/l10n/en-us.yaml b/pkg/sbombastic-image-vulnerability-scanner/l10n/en-us.yaml
index 22ca1ce..8008825 100644
--- a/pkg/sbombastic-image-vulnerability-scanner/l10n/en-us.yaml
+++ b/pkg/sbombastic-image-vulnerability-scanner/l10n/en-us.yaml
@@ -77,7 +77,7 @@ imageScanner:
       image:
         allImages: All images
         excludeBaseImages: Exclude base images
-        includeBaseImages: Include base images
+        includeBaseImages: Include base images only
       cve:
         allCves: All identified CVEs
         affectingCvesOnly: Affecting CVEs only
@@ -104,6 +104,13 @@ imageScanner:
     severityDistribution:
       title: Severity distribution
       subTitle: vulnerabilities in total
+    table:
+      headers:
+        cve: CVE ID
+        score: Score
+        affectedImages: Affected images
+        severity: Severity
+        identifiedImages: Images identified in
   vexManagement:
     title: VEX management
     description: Configure the security scanner to use up-to-date VEX reports. This will prioritize remediation efforts, focusing on vulnerabilities that are confirmed to be exploitable and reducing the noise coming from false positives.
diff --git a/pkg/sbombastic-image-vulnerability-scanner/pages/c/_cluster/sbombastic-image-vulnerability-scanner/Vulnerabilities.vue b/pkg/sbombastic-image-vulnerability-scanner/pages/c/_cluster/sbombastic-image-vulnerability-scanner/Vulnerabilities.vue
index 27dbd41..86e7bf7 100644
--- a/pkg/sbombastic-image-vulnerability-scanner/pages/c/_cluster/sbombastic-image-vulnerability-scanner/Vulnerabilities.vue
+++ b/pkg/sbombastic-image-vulnerability-scanner/pages/c/_cluster/sbombastic-image-vulnerability-scanner/Vulnerabilities.vue
@@ -1,71 +1,108 @@
 <template>
   <div class="page">
     <div class="header-section">
-        <h1>Vulnerabilities</h1>
+      <div class="title">
+        {{ t("imageScanner.vulnerabilities.title") }}
+      </div>
+      <div class="filter-dropdown">
+        <LabeledSelect
+          v-model:value="selectedImageFilter"
+          :options="filterImageOptions"
+          :close-on-select="true"
+          :multiple="false"
+        />
+      </div>
+      <div>
+        <button class="btn role-primary">
+          <i class="icon icon-download"></i>
+          {{ t('imageScanner.images.downloadReport') }}
+        </button>
+      </div>
     </div>
     <div class="summary-section">
       <TopSevereVulnerabilitiesChart 
         :topSevereVulnerabilities="topSevereVulnerabilities"
-        :totalVulnerabilities="totalVulnerabilities"
       />
       <SeverityDistribution :chartData="severityDistribution" />
     </div>
     <div class="table">
+      <SortableTable
+        :has-advanced-filtering="false"
+        :namespaced="false"
+        :row-actions="false"
+        :table-actions="true"
+        :force-update-live-and-delayed="0"
+        :use-query-params-for-simple-filtering="true"
+        :rows="vulnerabilities"
+        :headers="VULNERABILITIES_TABLE"
+        :key-field="'id'"
+        @selection="onSelectionChange"
+      >
+        <template #header-left>
+          <div class="table-top-left">
+            <DownloadCustomReport
+              class="table-btn" 
+              :selectedRows="selectedRows"
+              :buttonName="t('imageScanner.images.buttons.downloadCustomReport')"
+            />
+          </div>
+        </template>
+      </SortableTable>
     </div>
   </div>
 </template>
 
 <script>
-  import SeverityDistribution from '@sbombastic-image-vulnerability-scanner/components/SeverityDistribution.vue';
-  import TopSevereVulnerabilitiesChart from '@sbombastic-image-vulnerability-scanner/components/TopSevereVulnerabilitiesChart.vue';
+  import SortableTable from '@shell/components/SortableTable';
+  import LabeledSelect from "@shell/components/form/LabeledSelect";
+  import SeverityDistribution from '@sbombastic-image-vulnerability-scanner/components/SeverityDistribution';
+  import TopSevereVulnerabilitiesChart from '@sbombastic-image-vulnerability-scanner/components/TopSevereVulnerabilitiesChart';
+  import DownloadCustomReport from '@sbombastic-image-vulnerability-scanner/components/common/DownloadCustomReport';
+  import { VULNERABILITIES_TABLE } from '@sbombastic-image-vulnerability-scanner/config/table-headers';
+  import { severityDistribution, cves } from '@sbombastic-image-vulnerability-scanner/data/sbombastic.rancher.io.vulnerability';
 
   export default {
     name: 'vulnerabilities',
     components: {
       SeverityDistribution,
       TopSevereVulnerabilitiesChart,
+      DownloadCustomReport,
+      SortableTable,
+      LabeledSelect,
     },
     data() {
+      const filterImageOptions = [
+        this.t('imageScanner.images.filters.image.allImages'),
+        this.t('imageScanner.images.filters.image.excludeBaseImages'),
+        this.t('imageScanner.images.filters.image.includeBaseImages')
+      ];
       return {
-        severityDistribution: {
-          critical: 120,
-          high: 54,
-          medium: 23,
-          low: 65,
-          none: 200,
-        },
-        topSevereVulnerabilities: [
-          {
-            cve: 'CVE-2017-5337',
-            scoreV3: '9.9',
-            impactedImages: 103,
-          },
-          {
-            cve: 'CVE-2017-5336',
-            scoreV3: '9.6',
-            impactedImages: 98,
-          },
-          {
-            cve: 'CVE-2017-5335',
-            scoreV3: '8.8',
-            impactedImages: 95,
-          },
-          {
-            cve: 'CVE-2017-5334',
-            scoreV3: '8.6',
-            impactedImages: 92,
-          },
-          {
-            cve: 'CVE-2017-5333',
-            scoreV3: '8.5',
-            impactedImages: 90,
-          },
-        ],
+        VULNERABILITIES_TABLE,
+        severityDistribution: null,
+        topSevereVulnerabilities: [],
+        vulnerabilities: [],
+        selectedRows: [],
+        filterImageOptions,
+        selectedImageFilter: filterImageOptions[0],
       };
     },
-    computed: {
-      totalVulnerabilities() {
-        return Object.values(this.severityDistribution).reduce((sum, value) => sum + value, 0);
+    async fetch() {
+      // await this.$store.dispatch('sbombastic-image-vulnerability-scanner/load');
+      this.severityDistribution = severityDistribution;
+      const totalVulnerabilities = Object.values(this.severityDistribution).reduce((sum, value) => sum + value, 0);
+      this.vulnerabilities = cves.map(vul => ({
+        ...vul,
+        spec: {
+          ...vul.spec,
+          totalImages: totalVulnerabilities
+        }
+      }));
+      this.topSevereVulnerabilities = this.vulnerabilities.sort((a, b) => Number(b.spec.scoreV3) - Number(a.spec.scoreV3)).slice(0, 5);
+
+    },
+    methods: {
+      onSelectionChange(selected) {
+        this.selectedRows = selected || [];
       },
     },
   }
@@ -87,6 +124,27 @@
     align-items: flex-start;
     gap: 24px;
     align-self: stretch;
+
+    .title {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: flex-start;
+      gap: 4px;
+      flex: 1 0 0;
+      color: #141419;
+      font-family: Lato;
+      font-size: 24px;
+      font-style: normal;
+      font-weight: 600;
+      line-height: 32px; /* 133.333% */
+    }
+
+    .filter-dropdown {
+      display: flex;
+      width: 225px;
+      height: 40px;
+    }
   }
 
   .summary-section {
@@ -100,10 +158,6 @@
   }
 
   .table {
-    display: flex;
-    flex-direction: column;
-    align-items: flex-start;
-    gap: 24px;
-    align-self: stretch;
+    width: 100%;
   }
 </style>
\ No newline at end of file