Change color of svg

src/views/main/SelectedFooter.vue

@@ -7,15 +7,15 @@
 
   <div class="flex flex-row justify-center space-x-10 py-10">
     <a href="https://www.facebook.com/profile.php?id=61556819217561">
-      <v-icon size="40px">mdi-facebook</v-icon>
+      <v-icon size="40px" class="text-fuchsia-900">mdi-facebook</v-icon>
     </a>
 
     <a href="https://www.instagram.com/hutopy.inc/">
-      <v-icon size="40px">mdi-instagram</v-icon>
+      <v-icon size="40px"  class="text-fuchsia-900">mdi-instagram</v-icon>
     </a>
 
     <a href="https://x.com/Hutopyinc/">     
-      <img src="/images/hutopymedia/icons/x.svg" width="34px" height="34px" class="mt-1 custom-color fill-current">
+      <img src="/images/hutopymedia/icons/x.svg" width="34px" height="34px" class="mt-1 filter-fushia ">
     </a>
   </div>
 
@@ -50,3 +50,9 @@
 <script setup lang="ts">
 </script>
 
+<style>
+.filter-fushia{
+  filter: invert(14%) sepia(60%) saturate(4103%) hue-rotate(285deg) brightness(84%) contrast(93%);
+}
+</style>
+