diff --git a/frontend/src/pages/index/+Page.vue b/frontend/src/pages/index/+Page.vue
index a614885d8..bebd2217d 100644
--- a/frontend/src/pages/index/+Page.vue
+++ b/frontend/src/pages/index/+Page.vue
@@ -11,9 +11,22 @@
     <br />
     <p>{{ $t('home.greet1') }}</p>
     <p>{{ $t('home.greet2') }}</p>
+    <v-icon icon="mdi-heart" color="primary" />
+    <v-icon icon="mdi-heart" color="primary-darken-1" />
+    <v-icon icon="mdi-heart" color="secondary" />
+    <v-icon icon="mdi-heart" color="error" />
+    <v-icon icon="mdi-heart" :color="$vuetify.theme.themes.dark.colors.primary" />
+    <!-- <v-icon icon="mdi-heart" :color="$vuetify.theme.themes.dark.variables['theme-kbd']" /> -->
+    <v-icon icon="mdi-heart" />
   </DefaultLayout>
 </template>
 
 <script lang="ts" setup>
 import DefaultLayout from '#layouts/DefaultLayout.vue'
 </script>
+
+<style lang="scss">
+.icon-color {
+  color: var(--v-theme-primary);
+}
+</style>