diff --git a/ui/src/assets/icons/kubernetes.svg b/ui/src/assets/icons/kubernetes.svg
new file mode 100644
index 000000000000..db1f37bdfee1
--- /dev/null
+++ b/ui/src/assets/icons/kubernetes.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg  width="800px" height="800px" viewBox="0 0 32 32" id="icon" xmlns="http://www.w3.org/2000/svg">
+  <path  d="M29.2227,17.9639,25.9194,17.21a9.7843,9.7843,0,0,0-1.5249-6.6245l2.54-2.0254L25.6875,6.9961,23.1482,9.0205A9.97,9.97,0,0,0,17,6.0508V3H15V6.0508a9.97,9.97,0,0,0-6.1482,2.97L6.3125,6.9961,5.0654,8.56l2.54,2.0254A9.7843,9.7843,0,0,0,6.0806,17.21l-3.3033.7544.4454,1.9492L6.52,19.1606a10.0359,10.0359,0,0,0,4.2688,5.358l-1.33,2.7631,1.8018.8677L12.59,25.3882a9.8113,9.8113,0,0,0,6.8208,0L20.74,28.1494l1.8018-.8682-1.33-2.7626a10.0359,10.0359,0,0,0,4.2688-5.358l3.2973.7525ZM24,16c0,.2573-.0148.5112-.0386.7627l-5-1.1416a2.9664,2.9664,0,0,0-.1376-.5942L22.82,11.84A7.9392,7.9392,0,0,1,24,16Zm-9,0a1,1,0,1,1,1,1A1.0009,1.0009,0,0,1,15,16Zm6.5758-5.7256L17.58,13.4609a3.0028,3.0028,0,0,0-.58-.2768V8.0693A7.9762,7.9762,0,0,1,21.5758,10.2744ZM15,8.0693v5.1148a3.0028,3.0028,0,0,0-.58.2768l-3.9956-3.1865A7.9762,7.9762,0,0,1,15,8.0693ZM8,16a7.9392,7.9392,0,0,1,1.18-4.16l3.9962,3.1866a2.9664,2.9664,0,0,0-.1376.5942l-5,1.1416C8.0148,16.5112,8,16.2573,8,16Zm.4835,2.7124,4.9752-1.1362a3.0132,3.0132,0,0,0,.4146.5366L11.6594,22.71A8.031,8.031,0,0,1,8.4835,18.7124ZM16,24a7.9679,7.9679,0,0,1-2.54-.42l2.2206-4.6123A2.9988,2.9988,0,0,0,16,19a2.9988,2.9988,0,0,0,.319-.0322L18.54,23.58A7.9546,7.9546,0,0,1,16,24Zm4.3406-1.29-2.2139-4.5976a3.0132,3.0132,0,0,0,.4146-.5366l4.9752,1.1362A8.031,8.031,0,0,1,20.3406,22.71Z" transform="translate(0 0)"/>
+</svg>
\ No newline at end of file
diff --git a/ui/src/components/header/CreateMenu.vue b/ui/src/components/header/CreateMenu.vue
index 8c39ec5b8a07..aa1d020bdb60 100644
--- a/ui/src/components/header/CreateMenu.vue
+++ b/ui/src/components/header/CreateMenu.vue
@@ -26,7 +26,7 @@
                 <a-avatar :style="{ backgroundColor: $config.theme['@primary-color'] }">
                   <template #icon>
                     <render-icon v-if="(typeof menuItem.icon === 'string')" :icon="menuItem.icon" />
-                    <font-awesome-icon v-else :icon="menuItem.icon" />
+                    <render-icon v-else  :style="{fill:'#ffffff'}"  :svg-icon=menuItem.icon />
                   </template>
                 </a-avatar>
               </a-col>
@@ -50,6 +50,8 @@
 
 <script>
 
+import kubernetesIcon from '@/assets/icons/kubernetes.svg?inline'
+
 export default {
   name: 'CreateMenu',
   beforeCreate () {
@@ -65,7 +67,7 @@ export default {
         api: 'createKubernetesCluster',
         title: 'label.kubernetes',
         subtitle: 'label.kubernetes.cluster.create',
-        icon: ['fa-solid', 'fa-dharmachakra'],
+        icon: kubernetesIcon,
         route: { path: '/kubernetes', query: { action: 'createKubernetesCluster' } }
       },
       {
diff --git a/ui/src/config/section/compute.js b/ui/src/config/section/compute.js
index 7688566df423..53cc01476adf 100644
--- a/ui/src/config/section/compute.js
+++ b/ui/src/config/section/compute.js
@@ -18,6 +18,7 @@
 import { shallowRef, defineAsyncComponent } from 'vue'
 import store from '@/store'
 import { isZoneCreated } from '@/utils/zone'
+import kubernetesIcon from '@/assets/icons/kubernetes.svg?inline'
 
 export default {
   name: 'compute',
@@ -551,7 +552,7 @@ export default {
     {
       name: 'kubernetes',
       title: 'label.kubernetes',
-      icon: ['fa-solid', 'fa-dharmachakra'],
+      icon: kubernetesIcon,
       docHelp: 'plugins/cloudstack-kubernetes-service.html',
       searchFilters: ['name', 'domainid', 'account', 'state'],
       permission: ['listKubernetesClusters'],
diff --git a/ui/src/config/section/image.js b/ui/src/config/section/image.js
index f0458088b24f..eb673e124b0b 100644
--- a/ui/src/config/section/image.js
+++ b/ui/src/config/section/image.js
@@ -18,6 +18,7 @@
 import { shallowRef, defineAsyncComponent } from 'vue'
 import store from '@/store'
 import { isZoneCreated } from '@/utils/zone'
+import kubernetesIcon from '@/assets/icons/kubernetes.svg?inline'
 
 export default {
   name: 'image',
@@ -367,7 +368,7 @@ export default {
     {
       name: 'kubernetesiso',
       title: 'label.kubernetes.isos',
-      icon: ['fa-solid', 'fa-dharmachakra'],
+      icon: kubernetesIcon,
       docHelp: 'plugins/cloudstack-kubernetes-service.html#kubernetes-supported-versions',
       permission: ['listKubernetesSupportedVersions'],
       searchFilters: ['zoneid', 'minimumsemanticversion', 'arch'],
diff --git a/ui/src/utils/renderIcon.js b/ui/src/utils/renderIcon.js
index 8d982fd4adc0..b92fba28548b 100644
--- a/ui/src/utils/renderIcon.js
+++ b/ui/src/utils/renderIcon.js
@@ -45,8 +45,9 @@ export default {
       const props = Object.assign({}, this.props)
       props.width = '1em'
       props.height = '1em'
-      props.class = 'custom-icon'
-
+      if (!this.$attrs.style) {
+        props.class = 'custom-icon'
+      }
       return h('span', { role: 'img', class: 'anticon' }, [
         h(this.svgIcon, { ...props }, this.event)
       ])