diff --git a/src/views/user/settings.vue b/src/views/user/settings.vue
index f63d020..9a92fef 100644
--- a/src/views/user/settings.vue
+++ b/src/views/user/settings.vue
@@ -8,6 +8,7 @@ import { authClient } from "@/auth";
 
 const router = useRouter();
 const userProfile = ref<UserProfileData | null>(null);
+const birthday = computed(() => useDateFormat(userProfile?.value?.birthday || "", "YYYY/MM/DD"));
 
 async function getUserProfile() {
   const { data } = await client.api.user.profile.get();
@@ -151,9 +152,20 @@ onMounted(() => {
         </ion-item>
 
         <ion-item button>
-          <ion-datetime-button datetime="datetime" color="primary" />
+          <ion-datetime-button datetime="datetime" color="primary">
+            <div slot="date-target">
+              {{ birthday }}
+            </div>
+          </ion-datetime-button>
           <ion-modal :keep-contents-mounted="true">
-            <ion-datetime id="datetime" :value="userProfile?.birthday" presentation="date" :prefer-wheel="true" @ion-change="onChangeDateTime" />
+            <ion-datetime
+              id="datetime"
+              done-text="Done"
+              presentation="date"
+              :value="userProfile?.birthday"
+              :show-default-buttons="true"
+              @ion-change="onChangeDateTime"
+            />
           </ion-modal>
         </ion-item>
       </ion-list>