diff --git a/packages/frontend/src/components/MkAbuseReport.vue b/packages/frontend/src/components/MkAbuseReport.vue
index cdfe323d508fcb451a5b328f7d477224566dedc7..96f58269c4b66b030c446615b9acd2bc71eb0588 100644
--- a/packages/frontend/src/components/MkAbuseReport.vue
+++ b/packages/frontend/src/components/MkAbuseReport.vue
@@ -37,7 +37,7 @@
 
 <script lang="ts" setup>
 import MkButton from '@/components/MkButton.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import MkKeyValue from '@/components/MkKeyValue.vue';
 import { acct, userPage } from '@/filters/user';
 import * as os from '@/os';
diff --git a/packages/frontend/src/components/MkAsUi.vue b/packages/frontend/src/components/MkAsUi.vue
index e2d8c010a271e5d1aa70de1b281ef60d791b7bf4..9115de93cc0fe78103fee08cdf3ca1ca8791c4a3 100644
--- a/packages/frontend/src/components/MkAsUi.vue
+++ b/packages/frontend/src/components/MkAsUi.vue
@@ -52,7 +52,7 @@ import { computed, defineAsyncComponent, onMounted, onUnmounted, Ref } from 'vue
 import * as os from '@/os';
 import MkButton from '@/components/MkButton.vue';
 import MkInput from '@/components/form/input.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import MkTextarea from '@/components/form/textarea.vue';
 import MkSelect from '@/components/form/select.vue';
 import { AsUiComponent } from '@/scripts/aiscript/ui';
diff --git a/packages/frontend/src/components/form/checkbox.vue b/packages/frontend/src/components/MkCheckbox.vue
similarity index 100%
rename from packages/frontend/src/components/form/checkbox.vue
rename to packages/frontend/src/components/MkCheckbox.vue
diff --git a/packages/frontend/src/components/MkFormDialog.vue b/packages/frontend/src/components/MkFormDialog.vue
index 76c6c164d4b604db402fe164d64e464f805cf81a..d9a07b45d41a2a90c6dff2b517920236c6203681 100644
--- a/packages/frontend/src/components/MkFormDialog.vue
+++ b/packages/frontend/src/components/MkFormDialog.vue
@@ -29,10 +29,10 @@
 					<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
 					<template v-if="form[item].description" #caption>{{ form[item].description }}</template>
 				</FormTextarea>
-				<FormSwitch v-else-if="form[item].type === 'boolean'" v-model="values[item]">
+				<MkSwitch v-else-if="form[item].type === 'boolean'" v-model="values[item]">
 					<span v-text="form[item].label || item"></span>
 					<template v-if="form[item].description" #caption>{{ form[item].description }}</template>
-				</FormSwitch>
+				</MkSwitch>
 				<FormSelect v-else-if="form[item].type === 'enum'" v-model="values[item]">
 					<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
 					<option v-for="item in form[item].enum" :key="item.value" :value="item.value">{{ item.label }}</option>
@@ -58,7 +58,7 @@
 import { defineComponent } from 'vue';
 import FormInput from './form/input.vue';
 import FormTextarea from './form/textarea.vue';
-import FormSwitch from './form/switch.vue';
+import MkSwitch from './MkSwitch.vue';
 import FormSelect from './form/select.vue';
 import FormRange from './form/range.vue';
 import MkButton from './MkButton.vue';
@@ -70,7 +70,7 @@ export default defineComponent({
 		MkModalWindow,
 		FormInput,
 		FormTextarea,
-		FormSwitch,
+		MkSwitch,
 		FormSelect,
 		FormRange,
 		MkButton,
diff --git a/packages/frontend/src/components/MkMenu.vue b/packages/frontend/src/components/MkMenu.vue
index e9076138c613094086a3a6dfe598611286299482..31a3f7f1c1a4bfc4f9e8b17d945fbaf941ee1806 100644
--- a/packages/frontend/src/components/MkMenu.vue
+++ b/packages/frontend/src/components/MkMenu.vue
@@ -31,7 +31,7 @@
 				<span v-if="item.indicate" class="indicator"><i class="_indicatorCircle"></i></span>
 			</button>
 			<span v-else-if="item.type === 'switch'" :tabindex="i" class="item" @mouseenter.passive="onItemMouseEnter(item)" @mouseleave.passive="onItemMouseLeave(item)">
-				<FormSwitch v-model="item.ref" :disabled="item.disabled" class="form-switch">{{ item.text }}</FormSwitch>
+				<MkSwitch v-model="item.ref" :disabled="item.disabled" class="form-switch">{{ item.text }}</MkSwitch>
 			</span>
 			<button v-else-if="item.type === 'parent'" :tabindex="i" class="_button item parent" :class="{ childShowing: childShowingItem === item }" @mouseenter="showChildren(item, $event)">
 				<i v-if="item.icon" class="ti-fw" :class="item.icon"></i>
@@ -58,7 +58,7 @@
 <script lang="ts" setup>
 import { defineAsyncComponent, nextTick, onBeforeUnmount, onMounted, onUnmounted, Ref, ref, watch } from 'vue';
 import { focusPrev, focusNext } from '@/scripts/focus';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import { MenuItem, InnerMenuItem, MenuPending, MenuAction } from '@/types/menu';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
diff --git a/packages/frontend/src/components/MkNotificationSettingWindow.vue b/packages/frontend/src/components/MkNotificationSettingWindow.vue
index cb054b1a29ac2a64a0af4378ef0ef561213c15ec..e30340387267074ad1f5adcf43dde6a25d954a16 100644
--- a/packages/frontend/src/components/MkNotificationSettingWindow.vue
+++ b/packages/frontend/src/components/MkNotificationSettingWindow.vue
@@ -35,7 +35,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import { notificationTypes } from 'misskey-js';
-import MkSwitch from './form/switch.vue';
+import MkSwitch from './MkSwitch.vue';
 import MkInfo from './MkInfo.vue';
 import MkButton from './MkButton.vue';
 import MkModalWindow from '@/components/MkModalWindow.vue';
diff --git a/packages/frontend/src/components/MkPollEditor.vue b/packages/frontend/src/components/MkPollEditor.vue
index 556abc5fd0296f50984306a0724bb0d400f4261f..9eb45d0f9c6b5d2c0022bd120f96cff699dcc012 100644
--- a/packages/frontend/src/components/MkPollEditor.vue
+++ b/packages/frontend/src/components/MkPollEditor.vue
@@ -51,7 +51,7 @@
 import { ref, watch } from 'vue';
 import MkInput from './form/input.vue';
 import MkSelect from './form/select.vue';
-import MkSwitch from './form/switch.vue';
+import MkSwitch from './MkSwitch.vue';
 import MkButton from './MkButton.vue';
 import { formatDateTimeString } from '@/scripts/format-time-string';
 import { addTime } from '@/scripts/time';
diff --git a/packages/frontend/src/components/MkSample.vue b/packages/frontend/src/components/MkSample.vue
index ded5ac3f7a587d40889942370d3ed0a558343305..8d9b5d02050994264e7b71928c5eceaa2a184f5b 100644
--- a/packages/frontend/src/components/MkSample.vue
+++ b/packages/frontend/src/components/MkSample.vue
@@ -31,7 +31,7 @@
 import { defineComponent } from 'vue';
 import MkButton from '@/components/MkButton.vue';
 import MkInput from '@/components/form/input.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import MkTextarea from '@/components/form/textarea.vue';
 import MkRadio from '@/components/form/radio.vue';
 import * as os from '@/os';
diff --git a/packages/frontend/src/components/MkSignup.vue b/packages/frontend/src/components/MkSignup.vue
index dcffee47bdea91fec4ef0d5795cbfd1e70f3b0b7..da6464ed6a85324c2647bc7c826526cd79b09bab 100644
--- a/packages/frontend/src/components/MkSignup.vue
+++ b/packages/frontend/src/components/MkSignup.vue
@@ -70,7 +70,7 @@ import getPasswordStrength from 'syuilo-password-strength';
 import { toUnicode } from 'punycode/';
 import MkButton from './MkButton.vue';
 import MkInput from './form/input.vue';
-import MkSwitch from './form/switch.vue';
+import MkSwitch from './MkSwitch.vue';
 import MkCaptcha from '@/components/MkCaptcha.vue';
 import * as config from '@/config';
 import * as os from '@/os';
diff --git a/packages/frontend/src/components/form/switch.vue b/packages/frontend/src/components/MkSwitch.vue
similarity index 100%
rename from packages/frontend/src/components/form/switch.vue
rename to packages/frontend/src/components/MkSwitch.vue
diff --git a/packages/frontend/src/components/MkTokenGenerateWindow.vue b/packages/frontend/src/components/MkTokenGenerateWindow.vue
index 5e12aa83199f4a8e7fa06d6b83a014e731537c1c..5b9badd6dff416c0b9adbe64cfa34e9df2af9876 100644
--- a/packages/frontend/src/components/MkTokenGenerateWindow.vue
+++ b/packages/frontend/src/components/MkTokenGenerateWindow.vue
@@ -37,7 +37,7 @@
 import { } from 'vue';
 import { permissions as kinds } from 'misskey-js';
 import MkInput from './form/input.vue';
-import MkSwitch from './form/switch.vue';
+import MkSwitch from './MkSwitch.vue';
 import MkButton from './MkButton.vue';
 import MkInfo from './MkInfo.vue';
 import MkModalWindow from '@/components/MkModalWindow.vue';
diff --git a/packages/frontend/src/components/page/page.switch.vue b/packages/frontend/src/components/page/page.switch.vue
index 64dc4ff8aa14910fc051b64485d0ccd43f6efda6..d0d2637afa4591c430e91026588d9339f1135ec3 100644
--- a/packages/frontend/src/components/page/page.switch.vue
+++ b/packages/frontend/src/components/page/page.switch.vue
@@ -6,7 +6,7 @@
 
 <script lang="ts">
 import { computed, defineComponent, PropType } from 'vue';
-import MkSwitch from '../form/switch.vue';
+import MkSwitch from '../MkSwitch.vue';
 import * as os from '@/os';
 import { Hpml } from '@/scripts/hpml/evaluator';
 import { SwitchVarBlock } from '@/scripts/hpml/block';
diff --git a/packages/frontend/src/pages/admin-file.vue b/packages/frontend/src/pages/admin-file.vue
index f8a860e8b636099606f885eface82c7154adc7d8..6aac064c36b4dce3e9d0f2cbebd399db384c2f4f 100644
--- a/packages/frontend/src/pages/admin-file.vue
+++ b/packages/frontend/src/pages/admin-file.vue
@@ -64,7 +64,7 @@
 <script lang="ts" setup>
 import { computed } from 'vue';
 import MkButton from '@/components/MkButton.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import MkObjectView from '@/components/MkObjectView.vue';
 import MkDriveFileThumbnail from '@/components/MkDriveFileThumbnail.vue';
 import MkKeyValue from '@/components/MkKeyValue.vue';
diff --git a/packages/frontend/src/pages/admin/email-settings.vue b/packages/frontend/src/pages/admin/email-settings.vue
index ab19366ea686633d08cb129ba58cdbc902c20120..ee44a9f6abf289cf42cd22f734ea58f5ea03b2f1 100644
--- a/packages/frontend/src/pages/admin/email-settings.vue
+++ b/packages/frontend/src/pages/admin/email-settings.vue
@@ -4,10 +4,10 @@
 	<MkSpacer :content-max="700" :margin-min="16" :margin-max="32">
 		<FormSuspense :p="init">
 			<div class="_gaps_m">
-				<FormSwitch v-model="enableEmail">
+				<MkSwitch v-model="enableEmail">
 					<template #label>{{ i18n.ts.enableEmail }} ({{ i18n.ts.recommended }})</template>
 					<template #caption>{{ i18n.ts.emailConfigInfo }}</template>
-				</FormSwitch>
+				</MkSwitch>
 
 				<template v-if="enableEmail">
 					<FormInput v-model="email" type="email">
@@ -35,10 +35,10 @@
 								</FormInput>
 							</FormSplit>
 							<FormInfo>{{ i18n.ts.emptyToDisableSmtpAuth }}</FormInfo>
-							<FormSwitch v-model="smtpSecure">
+							<MkSwitch v-model="smtpSecure">
 								<template #label>{{ i18n.ts.smtpSecure }}</template>
 								<template #caption>{{ i18n.ts.smtpSecureInfo }}</template>
-							</FormSwitch>
+							</MkSwitch>
 						</div>
 					</FormSection>
 				</template>
@@ -51,7 +51,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import XHeader from './_header_.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormInput from '@/components/form/input.vue';
 import FormInfo from '@/components/MkInfo.vue';
 import FormSuspense from '@/components/form/suspense.vue';
diff --git a/packages/frontend/src/pages/admin/emojis.vue b/packages/frontend/src/pages/admin/emojis.vue
index 68ad51bce37413c9605428fdeeee8d41816962b1..2b697e717951d05a9d81928947e5dc625ad1f84d 100644
--- a/packages/frontend/src/pages/admin/emojis.vue
+++ b/packages/frontend/src/pages/admin/emojis.vue
@@ -74,7 +74,7 @@ import MkButton from '@/components/MkButton.vue';
 import MkInput from '@/components/form/input.vue';
 import MkPagination from '@/components/MkPagination.vue';
 import MkTab from '@/components/MkTab.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormSplit from '@/components/form/split.vue';
 import { selectFile, selectFiles } from '@/scripts/select-file';
 import * as os from '@/os';
diff --git a/packages/frontend/src/pages/admin/integrations.discord.vue b/packages/frontend/src/pages/admin/integrations.discord.vue
index 6e2156160cc77a93132e0c64de0a582dc4c6e606..284723ae2d6bd7172bc5b3f56ac259db45c718ac 100644
--- a/packages/frontend/src/pages/admin/integrations.discord.vue
+++ b/packages/frontend/src/pages/admin/integrations.discord.vue
@@ -1,9 +1,9 @@
 <template>
 <FormSuspense :p="init">
 	<div class="_gaps_m">
-		<FormSwitch v-model="enableDiscordIntegration">
+		<MkSwitch v-model="enableDiscordIntegration">
 			<template #label>{{ i18n.ts.enable }}</template>
-		</FormSwitch>
+		</MkSwitch>
 
 		<template v-if="enableDiscordIntegration">
 			<FormInfo>Callback URL: {{ `${uri}/api/dc/cb` }}</FormInfo>
@@ -26,7 +26,7 @@
 
 <script lang="ts" setup>
 import { } from 'vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormInput from '@/components/form/input.vue';
 import MkButton from '@/components/MkButton.vue';
 import FormInfo from '@/components/MkInfo.vue';
diff --git a/packages/frontend/src/pages/admin/integrations.github.vue b/packages/frontend/src/pages/admin/integrations.github.vue
index 352840adcf2313c548ac21e9534ef0c4cbec8963..0d379953b2319bf913502ef63f4512afa75ce586 100644
--- a/packages/frontend/src/pages/admin/integrations.github.vue
+++ b/packages/frontend/src/pages/admin/integrations.github.vue
@@ -1,9 +1,9 @@
 <template>
 <FormSuspense :p="init">
 	<div class="_gaps_m">
-		<FormSwitch v-model="enableGithubIntegration">
+		<MkSwitch v-model="enableGithubIntegration">
 			<template #label>{{ i18n.ts.enable }}</template>
-		</FormSwitch>
+		</MkSwitch>
 
 		<template v-if="enableGithubIntegration">
 			<FormInfo>Callback URL: {{ `${uri}/api/gh/cb` }}</FormInfo>
@@ -26,7 +26,7 @@
 
 <script lang="ts" setup>
 import { } from 'vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormInput from '@/components/form/input.vue';
 import MkButton from '@/components/MkButton.vue';
 import FormInfo from '@/components/MkInfo.vue';
diff --git a/packages/frontend/src/pages/admin/integrations.twitter.vue b/packages/frontend/src/pages/admin/integrations.twitter.vue
index a7b56fbad09c002a865c1c01c83e35234ebfde58..1a54f2ff15a691a4ea41eba51d67f0810f1294d1 100644
--- a/packages/frontend/src/pages/admin/integrations.twitter.vue
+++ b/packages/frontend/src/pages/admin/integrations.twitter.vue
@@ -1,9 +1,9 @@
 <template>
 <FormSuspense :p="init">
 	<div class="_gaps_m">
-		<FormSwitch v-model="enableTwitterIntegration">
+		<MkSwitch v-model="enableTwitterIntegration">
 			<template #label>{{ i18n.ts.enable }}</template>
-		</FormSwitch>
+		</MkSwitch>
 
 		<template v-if="enableTwitterIntegration">
 			<FormInfo>Callback URL: {{ `${uri}/api/tw/cb` }}</FormInfo>
@@ -26,7 +26,7 @@
 
 <script lang="ts" setup>
 import { defineComponent } from 'vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormInput from '@/components/form/input.vue';
 import MkButton from '@/components/MkButton.vue';
 import FormInfo from '@/components/MkInfo.vue';
diff --git a/packages/frontend/src/pages/admin/object-storage.vue b/packages/frontend/src/pages/admin/object-storage.vue
index f56e8bab93e50ff195a35c97edd3e180460e3931..b079950a66e4482dadeed0711c6e2dcf0145cfc1 100644
--- a/packages/frontend/src/pages/admin/object-storage.vue
+++ b/packages/frontend/src/pages/admin/object-storage.vue
@@ -4,7 +4,7 @@
 	<MkSpacer :content-max="700" :margin-min="16" :margin-max="32">
 		<FormSuspense :p="init">
 			<div class="_gaps_m">
-				<FormSwitch v-model="useObjectStorage">{{ i18n.ts.useObjectStorage }}</FormSwitch>
+				<MkSwitch v-model="useObjectStorage">{{ i18n.ts.useObjectStorage }}</MkSwitch>
 
 				<template v-if="useObjectStorage">
 					<FormInput v-model="objectStorageBaseUrl">
@@ -44,23 +44,23 @@
 						</FormInput>
 					</FormSplit>
 
-					<FormSwitch v-model="objectStorageUseSSL">
+					<MkSwitch v-model="objectStorageUseSSL">
 						<template #label>{{ i18n.ts.objectStorageUseSSL }}</template>
 						<template #caption>{{ i18n.ts.objectStorageUseSSLDesc }}</template>
-					</FormSwitch>
+					</MkSwitch>
 
-					<FormSwitch v-model="objectStorageUseProxy">
+					<MkSwitch v-model="objectStorageUseProxy">
 						<template #label>{{ i18n.ts.objectStorageUseProxy }}</template>
 						<template #caption>{{ i18n.ts.objectStorageUseProxyDesc }}</template>
-					</FormSwitch>
+					</MkSwitch>
 
-					<FormSwitch v-model="objectStorageSetPublicRead">
+					<MkSwitch v-model="objectStorageSetPublicRead">
 						<template #label>{{ i18n.ts.objectStorageSetPublicRead }}</template>
-					</FormSwitch>
+					</MkSwitch>
 
-					<FormSwitch v-model="objectStorageS3ForcePathStyle">
+					<MkSwitch v-model="objectStorageS3ForcePathStyle">
 						<template #label>s3ForcePathStyle</template>
-					</FormSwitch>
+					</MkSwitch>
 				</template>
 			</div>
 		</FormSuspense>
@@ -71,7 +71,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import XHeader from './_header_.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormInput from '@/components/form/input.vue';
 import FormSuspense from '@/components/form/suspense.vue';
 import FormSplit from '@/components/form/split.vue';
diff --git a/packages/frontend/src/pages/admin/security.vue b/packages/frontend/src/pages/admin/security.vue
index 997ee31fe360fa13517c1a4dac895d858f6fc287..b514c3fbba4a2383a83ea128f0f0fdb6154b6529 100644
--- a/packages/frontend/src/pages/admin/security.vue
+++ b/packages/frontend/src/pages/admin/security.vue
@@ -38,20 +38,20 @@
 							<template #caption>{{ i18n.ts._sensitiveMediaDetection.sensitivityDescription }}</template>
 						</FormRange>
 
-						<FormSwitch v-model="enableSensitiveMediaDetectionForVideos">
+						<MkSwitch v-model="enableSensitiveMediaDetectionForVideos">
 							<template #label>{{ i18n.ts._sensitiveMediaDetection.analyzeVideos }}<span class="_beta">{{ i18n.ts.beta }}</span></template>
 							<template #caption>{{ i18n.ts._sensitiveMediaDetection.analyzeVideosDescription }}</template>
-						</FormSwitch>
+						</MkSwitch>
 
-						<FormSwitch v-model="setSensitiveFlagAutomatically">
+						<MkSwitch v-model="setSensitiveFlagAutomatically">
 							<template #label>{{ i18n.ts._sensitiveMediaDetection.setSensitiveFlagAutomatically }} ({{ i18n.ts.notRecommended }})</template>
 							<template #caption>{{ i18n.ts._sensitiveMediaDetection.setSensitiveFlagAutomaticallyDescription }}</template>
-						</FormSwitch>
+						</MkSwitch>
 
 						<!-- 現状 false positive が多すぎて実用に耐えない
-						<FormSwitch v-model="disallowUploadWhenPredictedAsPorn">
+						<MkSwitch v-model="disallowUploadWhenPredictedAsPorn">
 							<template #label>{{ i18n.ts._sensitiveMediaDetection.disallowUploadWhenPredictedAsPorn }}</template>
-						</FormSwitch>
+						</MkSwitch>
 						-->
 
 						<MkButton primary @click="save"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>
@@ -65,9 +65,9 @@
 
 					<div class="_gaps_m">
 						<span>{{ i18n.ts.activeEmailValidationDescription }}</span>
-						<FormSwitch v-model="enableActiveEmailValidation" @update:model-value="save">
+						<MkSwitch v-model="enableActiveEmailValidation" @update:model-value="save">
 							<template #label>Enable</template>
-						</FormSwitch>
+						</MkSwitch>
 					</div>
 				</FormFolder>
 
@@ -77,9 +77,9 @@
 					<template v-else #suffix>Disabled</template>
 
 					<div class="_gaps_m">
-						<FormSwitch v-model="enableIpLogging" @update:model-value="save">
+						<MkSwitch v-model="enableIpLogging" @update:model-value="save">
 							<template #label>Enable</template>
-						</FormSwitch>
+						</MkSwitch>
 					</div>
 				</FormFolder>
 
@@ -107,7 +107,7 @@ import XBotProtection from './bot-protection.vue';
 import XHeader from './_header_.vue';
 import FormFolder from '@/components/form/folder.vue';
 import FormRadios from '@/components/form/radios.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormInfo from '@/components/MkInfo.vue';
 import FormSuspense from '@/components/form/suspense.vue';
 import FormRange from '@/components/form/range.vue';
diff --git a/packages/frontend/src/pages/admin/settings.vue b/packages/frontend/src/pages/admin/settings.vue
index 2d7822efbec9d90021dda6a80a41f8fe2089c862..2675d43d725b852b87a455c9590a1bff69e6e301 100644
--- a/packages/frontend/src/pages/admin/settings.vue
+++ b/packages/frontend/src/pages/admin/settings.vue
@@ -36,20 +36,20 @@
 
 					<FormSection>
 						<div class="_gaps_s">
-							<FormSwitch v-model="enableRegistration">
+							<MkSwitch v-model="enableRegistration">
 								<template #label>{{ i18n.ts.enableRegistration }}</template>
-							</FormSwitch>
+							</MkSwitch>
 
-							<FormSwitch v-model="emailRequiredForSignup">
+							<MkSwitch v-model="emailRequiredForSignup">
 								<template #label>{{ i18n.ts.emailRequiredForSignup }}</template>
-							</FormSwitch>
+							</MkSwitch>
 						</div>
 					</FormSection>
 
 					<FormSection>
 						<div class="_gaps_s">
-							<FormSwitch v-model="enableLocalTimeline">{{ i18n.ts.enableLocalTimeline }}</FormSwitch>
-							<FormSwitch v-model="enableGlobalTimeline">{{ i18n.ts.enableGlobalTimeline }}</FormSwitch>
+							<MkSwitch v-model="enableLocalTimeline">{{ i18n.ts.enableLocalTimeline }}</MkSwitch>
+							<MkSwitch v-model="enableGlobalTimeline">{{ i18n.ts.enableGlobalTimeline }}</MkSwitch>
 							<FormInfo>{{ i18n.ts.disablingTimelinesInfo }}</FormInfo>
 						</div>
 					</FormSection>
@@ -95,10 +95,10 @@
 						<template #label>{{ i18n.ts.files }}</template>
 
 						<div class="_gaps_m">
-							<FormSwitch v-model="cacheRemoteFiles">
+							<MkSwitch v-model="cacheRemoteFiles">
 								<template #label>{{ i18n.ts.cacheRemoteFiles }}</template>
 								<template #caption>{{ i18n.ts.cacheRemoteFilesDescription }}</template>
-							</FormSwitch>
+							</MkSwitch>
 
 							<FormSplit :min-width="280">
 								<FormInput v-model="localDriveCapacityMb" type="number">
@@ -120,10 +120,10 @@
 						<template #label>ServiceWorker</template>
 
 						<div class="_gaps_m">
-							<FormSwitch v-model="enableServiceWorker">
+							<MkSwitch v-model="enableServiceWorker">
 								<template #label>{{ i18n.ts.enableServiceworker }}</template>
 								<template #caption>{{ i18n.ts.serviceworkerInfo }}</template>
-							</FormSwitch>
+							</MkSwitch>
 
 							<template v-if="enableServiceWorker">
 								<FormInput v-model="swPublicKey">
@@ -147,9 +147,9 @@
 								<template #prefix><i class="ti ti-key"></i></template>
 								<template #label>DeepL Auth Key</template>
 							</FormInput>
-							<FormSwitch v-model="deeplIsPro">
+							<MkSwitch v-model="deeplIsPro">
 								<template #label>Pro account</template>
-							</FormSwitch>
+							</MkSwitch>
 						</div>
 					</FormSection>
 				</div>
@@ -162,7 +162,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import XHeader from './_header_.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormInput from '@/components/form/input.vue';
 import FormTextarea from '@/components/form/textarea.vue';
 import FormInfo from '@/components/MkInfo.vue';
diff --git a/packages/frontend/src/pages/api-console.vue b/packages/frontend/src/pages/api-console.vue
index c8ca3fffa731c4318df3587ba10e69312c5e60bf..ee7d04650106c9f665e20a3112c662f7c1040352 100644
--- a/packages/frontend/src/pages/api-console.vue
+++ b/packages/frontend/src/pages/api-console.vue
@@ -35,7 +35,7 @@ import { Endpoints } from 'misskey-js';
 import MkButton from '@/components/MkButton.vue';
 import MkInput from '@/components/form/input.vue';
 import MkTextarea from '@/components/form/textarea.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import * as os from '@/os';
 import { definePageMetadata } from '@/scripts/page-metadata';
 
diff --git a/packages/frontend/src/pages/gallery/edit.vue b/packages/frontend/src/pages/gallery/edit.vue
index 0e3a1ce061c3d316bd65a0e242a40f4f8de792ed..83a345ae753b2e73bd6104a35d1147e5c4770eff 100644
--- a/packages/frontend/src/pages/gallery/edit.vue
+++ b/packages/frontend/src/pages/gallery/edit.vue
@@ -19,7 +19,7 @@
 				<MkButton primary @click="selectFile"><i class="ti ti-plus"></i> {{ i18n.ts.attachFile }}</MkButton>
 			</div>
 
-			<FormSwitch v-model="isSensitive">{{ i18n.ts.markAsSensitive }}</FormSwitch>
+			<MkSwitch v-model="isSensitive">{{ i18n.ts.markAsSensitive }}</MkSwitch>
 
 			<MkButton v-if="postId" primary @click="save"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>
 			<MkButton v-else primary @click="save"><i class="ti ti-device-floppy"></i> {{ i18n.ts.publish }}</MkButton>
@@ -35,7 +35,7 @@ import { computed, inject, watch } from 'vue';
 import MkButton from '@/components/MkButton.vue';
 import FormInput from '@/components/form/input.vue';
 import FormTextarea from '@/components/form/textarea.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormSuspense from '@/components/form/suspense.vue';
 import { selectFiles } from '@/scripts/select-file';
 import * as os from '@/os';
diff --git a/packages/frontend/src/pages/instance-info.vue b/packages/frontend/src/pages/instance-info.vue
index e0f0d855eb9662da9397f21f760b9b8b68a70572..8d71a5c30840bc481f90723ac6c54fad94625972 100644
--- a/packages/frontend/src/pages/instance-info.vue
+++ b/packages/frontend/src/pages/instance-info.vue
@@ -29,8 +29,8 @@
 			<FormSection v-if="iAmModerator">
 				<template #label>Moderation</template>
 				<div class="_gaps_s">
-					<FormSwitch v-model="suspended" @update:model-value="toggleSuspend">{{ i18n.ts.stopActivityDelivery }}</FormSwitch>
-					<FormSwitch v-model="isBlocked" @update:model-value="toggleBlock">{{ i18n.ts.blockThisInstance }}</FormSwitch>
+					<MkSwitch v-model="suspended" @update:model-value="toggleSuspend">{{ i18n.ts.stopActivityDelivery }}</MkSwitch>
+					<MkSwitch v-model="isBlocked" @update:model-value="toggleBlock">{{ i18n.ts.blockThisInstance }}</MkSwitch>
 					<MkButton @click="refreshMetadata"><i class="ti ti-refresh"></i> Refresh metadata</MkButton>
 				</div>
 			</FormSection>
@@ -121,7 +121,7 @@ import MkButton from '@/components/MkButton.vue';
 import FormSection from '@/components/form/section.vue';
 import MkKeyValue from '@/components/MkKeyValue.vue';
 import MkSelect from '@/components/form/select.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import * as os from '@/os';
 import number from '@/filters/number';
 import bytes from '@/filters/bytes';
diff --git a/packages/frontend/src/pages/my-antennas/editor.vue b/packages/frontend/src/pages/my-antennas/editor.vue
index 6e7405735eff3755c1d45cca93dcc2e3c924ea4c..966bf1e59cce5f384f2d212a447e2adcbcd82e3d 100644
--- a/packages/frontend/src/pages/my-antennas/editor.vue
+++ b/packages/frontend/src/pages/my-antennas/editor.vue
@@ -53,7 +53,7 @@ import MkButton from '@/components/MkButton.vue';
 import MkInput from '@/components/form/input.vue';
 import MkTextarea from '@/components/form/textarea.vue';
 import MkSelect from '@/components/form/select.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 
diff --git a/packages/frontend/src/pages/page-editor/els/page-editor.el.note.vue b/packages/frontend/src/pages/page-editor/els/page-editor.el.note.vue
index dc2a620c0975c17eadb72353ac4adeaa8f0adf0f..19e8b9950ff33a114c924bc3d119545948d5ce94 100644
--- a/packages/frontend/src/pages/page-editor/els/page-editor.el.note.vue
+++ b/packages/frontend/src/pages/page-editor/els/page-editor.el.note.vue
@@ -21,7 +21,7 @@
 import { watch } from 'vue';
 import XContainer from '../page-editor.container.vue';
 import MkInput from '@/components/form/input.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import XNote from '@/components/MkNote.vue';
 import XNoteDetailed from '@/components/MkNoteDetailed.vue';
 import * as os from '@/os';
diff --git a/packages/frontend/src/pages/page-editor/page-editor.vue b/packages/frontend/src/pages/page-editor/page-editor.vue
index a01daf9a2717c32e7263ac61df0a65461973bb1e..4c5a13b92d694b7f238846eb23c3f809bedbe029 100644
--- a/packages/frontend/src/pages/page-editor/page-editor.vue
+++ b/packages/frontend/src/pages/page-editor/page-editor.vue
@@ -62,7 +62,7 @@ import XBlocks from './page-editor.blocks.vue';
 import MkTextarea from '@/components/form/textarea.vue';
 import MkButton from '@/components/MkButton.vue';
 import MkSelect from '@/components/form/select.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import MkInput from '@/components/form/input.vue';
 import { url } from '@/config';
 import * as os from '@/os';
diff --git a/packages/frontend/src/pages/settings/2fa.vue b/packages/frontend/src/pages/settings/2fa.vue
index 1803129aaa67f4145f30c1f686b653e9bc6d3133..e9ff770938d32da59fc168ae3d280496f23fb34e 100644
--- a/packages/frontend/src/pages/settings/2fa.vue
+++ b/packages/frontend/src/pages/settings/2fa.vue
@@ -71,7 +71,7 @@ import { byteify, hexify, stringify } from '@/scripts/2fa';
 import MkButton from '@/components/MkButton.vue';
 import MkInfo from '@/components/MkInfo.vue';
 import MkInput from '@/components/form/input.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import * as os from '@/os';
 import { $i } from '@/account';
 import { i18n } from '@/i18n';
diff --git a/packages/frontend/src/pages/settings/deck.vue b/packages/frontend/src/pages/settings/deck.vue
index 4455b90c0b222cfdbe0a4ad920324932cbb51056..1437e3097e7dae12c33783ce28610fa87e9aeb58 100644
--- a/packages/frontend/src/pages/settings/deck.vue
+++ b/packages/frontend/src/pages/settings/deck.vue
@@ -1,8 +1,8 @@
 <template>
 <div class="_gaps_m">
-	<FormSwitch v-model="navWindow">{{ i18n.ts.defaultNavigationBehaviour }}: {{ i18n.ts.openInWindow }}</FormSwitch>
+	<MkSwitch v-model="navWindow">{{ i18n.ts.defaultNavigationBehaviour }}: {{ i18n.ts.openInWindow }}</MkSwitch>
 
-	<FormSwitch v-model="alwaysShowMainColumn">{{ i18n.ts._deck.alwaysShowMainColumn }}</FormSwitch>
+	<MkSwitch v-model="alwaysShowMainColumn">{{ i18n.ts._deck.alwaysShowMainColumn }}</MkSwitch>
 
 	<FormRadios v-model="columnAlign">
 		<template #label>{{ i18n.ts._deck.columnAlign }}</template>
@@ -14,7 +14,7 @@
 
 <script lang="ts" setup>
 import { computed, watch } from 'vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormLink from '@/components/form/link.vue';
 import FormRadios from '@/components/form/radios.vue';
 import FormInput from '@/components/form/input.vue';
diff --git a/packages/frontend/src/pages/settings/drive.vue b/packages/frontend/src/pages/settings/drive.vue
index acfee9537b54a53e11fa1f8d59dd41193154eaa5..4099a3c11da124304688bb6d01200f11c488e9c1 100644
--- a/packages/frontend/src/pages/settings/drive.vue
+++ b/packages/frontend/src/pages/settings/drive.vue
@@ -32,17 +32,17 @@
 				<template #suffix>{{ uploadFolder ? uploadFolder.name : '-' }}</template>
 				<template #suffixIcon><i class="fas fa-folder-open"></i></template>
 			</FormLink>
-			<FormSwitch v-model="keepOriginalUploading">
+			<MkSwitch v-model="keepOriginalUploading">
 				<template #label>{{ i18n.ts.keepOriginalUploading }}</template>
 				<template #caption>{{ i18n.ts.keepOriginalUploadingDescription }}</template>
-			</FormSwitch>
-			<FormSwitch v-model="alwaysMarkNsfw" @update:model-value="saveProfile()">
+			</MkSwitch>
+			<MkSwitch v-model="alwaysMarkNsfw" @update:model-value="saveProfile()">
 				<template #label>{{ i18n.ts.alwaysMarkSensitive }}</template>
-			</FormSwitch>
-			<FormSwitch v-model="autoSensitive" @update:model-value="saveProfile()">
+			</MkSwitch>
+			<MkSwitch v-model="autoSensitive" @update:model-value="saveProfile()">
 				<template #label>{{ i18n.ts.enableAutoSensitive }}<span class="_beta">{{ i18n.ts.beta }}</span></template>
 				<template #caption>{{ i18n.ts.enableAutoSensitiveDescription }}</template>
-			</FormSwitch>
+			</MkSwitch>
 		</div>
 	</FormSection>
 </div>
@@ -52,7 +52,7 @@
 import { computed, ref } from 'vue';
 import tinycolor from 'tinycolor2';
 import FormLink from '@/components/form/link.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormSection from '@/components/form/section.vue';
 import MkKeyValue from '@/components/MkKeyValue.vue';
 import FormSplit from '@/components/form/split.vue';
diff --git a/packages/frontend/src/pages/settings/email.vue b/packages/frontend/src/pages/settings/email.vue
index 569115bda8c9a3f9e8a9999f783d58cf6dcd6864..bb885f7b1fabbe0391151f7452a75319a25f3e1e 100644
--- a/packages/frontend/src/pages/settings/email.vue
+++ b/packages/frontend/src/pages/settings/email.vue
@@ -10,33 +10,33 @@
 	</FormSection>
 
 	<FormSection>
-		<FormSwitch :model-value="$i.receiveAnnouncementEmail" @update:model-value="onChangeReceiveAnnouncementEmail">
+		<MkSwitch :model-value="$i.receiveAnnouncementEmail" @update:model-value="onChangeReceiveAnnouncementEmail">
 			{{ i18n.ts.receiveAnnouncementFromInstance }}
-		</FormSwitch>
+		</MkSwitch>
 	</FormSection>
 
 	<FormSection>
 		<template #label>{{ i18n.ts.emailNotification }}</template>
 
 		<div class="_gaps_s">
-			<FormSwitch v-model="emailNotification_mention">
+			<MkSwitch v-model="emailNotification_mention">
 				{{ i18n.ts._notification._types.mention }}
-			</FormSwitch>
-			<FormSwitch v-model="emailNotification_reply">
+			</MkSwitch>
+			<MkSwitch v-model="emailNotification_reply">
 				{{ i18n.ts._notification._types.reply }}
-			</FormSwitch>
-			<FormSwitch v-model="emailNotification_quote">
+			</MkSwitch>
+			<MkSwitch v-model="emailNotification_quote">
 				{{ i18n.ts._notification._types.quote }}
-			</FormSwitch>
-			<FormSwitch v-model="emailNotification_follow">
+			</MkSwitch>
+			<MkSwitch v-model="emailNotification_follow">
 				{{ i18n.ts._notification._types.follow }}
-			</FormSwitch>
-			<FormSwitch v-model="emailNotification_receiveFollowRequest">
+			</MkSwitch>
+			<MkSwitch v-model="emailNotification_receiveFollowRequest">
 				{{ i18n.ts._notification._types.receiveFollowRequest }}
-			</FormSwitch>
-			<FormSwitch v-model="emailNotification_groupInvited">
+			</MkSwitch>
+			<MkSwitch v-model="emailNotification_groupInvited">
 				{{ i18n.ts._notification._types.groupInvited }}
-			</FormSwitch>
+			</MkSwitch>
 		</div>
 	</FormSection>
 </div>
@@ -46,7 +46,7 @@
 import { onMounted, ref, watch } from 'vue';
 import FormSection from '@/components/form/section.vue';
 import FormInput from '@/components/form/input.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import * as os from '@/os';
 import { $i } from '@/account';
 import { i18n } from '@/i18n';
diff --git a/packages/frontend/src/pages/settings/general.vue b/packages/frontend/src/pages/settings/general.vue
index 580c38149a3aca374207709d8318ed1ec7f2a657..32bc79b8191baa3925aaf67f0b619d30f8dd57ea 100644
--- a/packages/frontend/src/pages/settings/general.vue
+++ b/packages/frontend/src/pages/settings/general.vue
@@ -20,16 +20,16 @@
 		<option value="desktop"><i class="ti ti-device-desktop"/> {{ i18n.ts.desktop }}</option>
 	</FormRadios>
 
-	<FormSwitch v-model="showFixedPostForm">{{ i18n.ts.showFixedPostForm }}</FormSwitch>
+	<MkSwitch v-model="showFixedPostForm">{{ i18n.ts.showFixedPostForm }}</MkSwitch>
 
 	<FormSection>
 		<template #label>{{ i18n.ts.behavior }}</template>
 
 		<div class="_gaps_m">
 			<div class="_gaps_s">
-				<FormSwitch v-model="imageNewTab">{{ i18n.ts.openImageInNewTab }}</FormSwitch>
-				<FormSwitch v-model="enableInfiniteScroll">{{ i18n.ts.enableInfiniteScroll }}</FormSwitch>
-				<FormSwitch v-model="useReactionPickerForContextMenu">{{ i18n.ts.useReactionPickerForContextMenu }}</FormSwitch>
+				<MkSwitch v-model="imageNewTab">{{ i18n.ts.openImageInNewTab }}</MkSwitch>
+				<MkSwitch v-model="enableInfiniteScroll">{{ i18n.ts.enableInfiniteScroll }}</MkSwitch>
+				<MkSwitch v-model="useReactionPickerForContextMenu">{{ i18n.ts.useReactionPickerForContextMenu }}</MkSwitch>
 			</div>
 			<FormSelect v-model="serverDisconnectedBehavior">
 				<template #label>{{ i18n.ts.whenServerDisconnected }}</template>
@@ -45,16 +45,16 @@
 
 		<div class="_gaps_m">
 			<div class="_gaps_s">
-				<FormSwitch v-model="disableAnimatedMfm">{{ i18n.ts.disableAnimatedMfm }}</FormSwitch>
-				<FormSwitch v-model="reduceAnimation">{{ i18n.ts.reduceUiAnimation }}</FormSwitch>
-				<FormSwitch v-model="useBlurEffect">{{ i18n.ts.useBlurEffect }}</FormSwitch>
-				<FormSwitch v-model="useBlurEffectForModal">{{ i18n.ts.useBlurEffectForModal }}</FormSwitch>
-				<FormSwitch v-model="showGapBetweenNotesInTimeline">{{ i18n.ts.showGapBetweenNotesInTimeline }}</FormSwitch>
-				<FormSwitch v-model="loadRawImages">{{ i18n.ts.loadRawImages }}</FormSwitch>
-				<FormSwitch v-model="disableShowingAnimatedImages">{{ i18n.ts.disableShowingAnimatedImages }}</FormSwitch>
-				<FormSwitch v-model="squareAvatars">{{ i18n.ts.squareAvatars }}</FormSwitch>
-				<FormSwitch v-model="useSystemFont">{{ i18n.ts.useSystemFont }}</FormSwitch>
-				<FormSwitch v-model="disableDrawer">{{ i18n.ts.disableDrawer }}</FormSwitch>
+				<MkSwitch v-model="disableAnimatedMfm">{{ i18n.ts.disableAnimatedMfm }}</MkSwitch>
+				<MkSwitch v-model="reduceAnimation">{{ i18n.ts.reduceUiAnimation }}</MkSwitch>
+				<MkSwitch v-model="useBlurEffect">{{ i18n.ts.useBlurEffect }}</MkSwitch>
+				<MkSwitch v-model="useBlurEffectForModal">{{ i18n.ts.useBlurEffectForModal }}</MkSwitch>
+				<MkSwitch v-model="showGapBetweenNotesInTimeline">{{ i18n.ts.showGapBetweenNotesInTimeline }}</MkSwitch>
+				<MkSwitch v-model="loadRawImages">{{ i18n.ts.loadRawImages }}</MkSwitch>
+				<MkSwitch v-model="disableShowingAnimatedImages">{{ i18n.ts.disableShowingAnimatedImages }}</MkSwitch>
+				<MkSwitch v-model="squareAvatars">{{ i18n.ts.squareAvatars }}</MkSwitch>
+				<MkSwitch v-model="useSystemFont">{{ i18n.ts.useSystemFont }}</MkSwitch>
+				<MkSwitch v-model="disableDrawer">{{ i18n.ts.disableDrawer }}</MkSwitch>
 			</div>
 			<div>
 				<FormRadios v-model="emojiStyle">
@@ -77,7 +77,7 @@
 	</FormSection>
 
 	<FormSection>
-		<FormSwitch v-model="aiChanMode">{{ i18n.ts.aiChanMode }}</FormSwitch>
+		<MkSwitch v-model="aiChanMode">{{ i18n.ts.aiChanMode }}</MkSwitch>
 	</FormSection>
 
 	<FormSelect v-model="instanceTicker">
@@ -107,7 +107,7 @@
 
 <script lang="ts" setup>
 import { computed, ref, watch } from 'vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormSelect from '@/components/form/select.vue';
 import FormRadios from '@/components/form/radios.vue';
 import FormRange from '@/components/form/range.vue';
diff --git a/packages/frontend/src/pages/settings/import-export.vue b/packages/frontend/src/pages/settings/import-export.vue
index d055304824bcef323cf63b0c1f01931b8fc0ba81..e04fe37ac89ca6427efd69e1400366aab754e42d 100644
--- a/packages/frontend/src/pages/settings/import-export.vue
+++ b/packages/frontend/src/pages/settings/import-export.vue
@@ -23,12 +23,12 @@
 				<template #label>{{ i18n.ts.export }}</template>
 				<template #icon><i class="ti ti-download"></i></template>
 				<div class="_gaps_s">
-					<FormSwitch v-model="excludeMutingUsers">
+					<MkSwitch v-model="excludeMutingUsers">
 						{{ i18n.ts._exportOrImport.excludeMutingUsers }}
-					</FormSwitch>
-					<FormSwitch v-model="excludeInactiveUsers">
+					</MkSwitch>
+					<MkSwitch v-model="excludeInactiveUsers">
 						{{ i18n.ts._exportOrImport.excludeInactiveUsers }}
-					</FormSwitch>
+					</MkSwitch>
 					<MkButton primary :class="$style.button" inline @click="exportFollowing()"><i class="ti ti-download"></i> {{ i18n.ts.export }}</MkButton>
 				</div>
 			</FormFolder>
@@ -92,7 +92,7 @@ import { ref } from 'vue';
 import MkButton from '@/components/MkButton.vue';
 import FormSection from '@/components/form/section.vue';
 import FormFolder from '@/components/form/folder.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import * as os from '@/os';
 import { selectFile } from '@/scripts/select-file';
 import { i18n } from '@/i18n';
diff --git a/packages/frontend/src/pages/settings/notifications.vue b/packages/frontend/src/pages/settings/notifications.vue
index 8799f44041be5327094f5df56edb67edb2976344..db32ee862c58acdcb78cc0c1a3cff65e607f0210 100644
--- a/packages/frontend/src/pages/settings/notifications.vue
+++ b/packages/frontend/src/pages/settings/notifications.vue
@@ -13,14 +13,14 @@
 
 		<div class="_gaps_m">
 			<MkPushNotificationAllowButton ref="allowButton"/>
-			<FormSwitch :disabled="!pushRegistrationInServer" :model-value="sendReadMessage" @update:model-value="onChangeSendReadMessage">
+			<MkSwitch :disabled="!pushRegistrationInServer" :model-value="sendReadMessage" @update:model-value="onChangeSendReadMessage">
 				<template #label>{{ i18n.ts.sendPushNotificationReadMessage }}</template>
 				<template #caption>
 					<I18n :src="i18n.ts.sendPushNotificationReadMessageCaption">
 						<template #emptyPushNotificationMessage>{{ i18n.ts._notification.emptyPushNotificationMessage }}</template>
 					</I18n>
 				</template>
-			</FormSwitch>
+			</MkSwitch>
 		</div>
 	</FormSection>
 </div>
@@ -32,7 +32,7 @@ import { notificationTypes } from 'misskey-js';
 import MkButton from '@/components/MkButton.vue';
 import FormLink from '@/components/form/link.vue';
 import FormSection from '@/components/form/section.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import * as os from '@/os';
 import { $i } from '@/account';
 import { i18n } from '@/i18n';
diff --git a/packages/frontend/src/pages/settings/other.vue b/packages/frontend/src/pages/settings/other.vue
index f3c1b3dc2d2d62a9191d044ff8836d57dbe6bcca..892ea61e75d02f4134e7912302159eae5394dea2 100644
--- a/packages/frontend/src/pages/settings/other.vue
+++ b/packages/frontend/src/pages/settings/other.vue
@@ -1,11 +1,11 @@
 <template>
 <div class="_gaps_m">
-	<FormSwitch v-model="$i.injectFeaturedNote" @update:model-value="onChangeInjectFeaturedNote">
+	<MkSwitch v-model="$i.injectFeaturedNote" @update:model-value="onChangeInjectFeaturedNote">
 		{{ i18n.ts.showFeaturedNotesInTimeline }}
-	</FormSwitch>
+	</MkSwitch>
 
 	<!--
-	<FormSwitch v-model="reportError">{{ i18n.ts.sendErrorReports }}<template #caption>{{ i18n.ts.sendErrorReportsDescription }}</template></FormSwitch>
+	<MkSwitch v-model="reportError">{{ i18n.ts.sendErrorReports }}<template #caption>{{ i18n.ts.sendErrorReportsDescription }}</template></MkSwitch>
 	-->
 
 	<FormLink to="/settings/account-info">{{ i18n.ts.accountInfo }}</FormLink>
@@ -18,7 +18,7 @@
 
 <script lang="ts" setup>
 import { computed } from 'vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormLink from '@/components/form/link.vue';
 import * as os from '@/os';
 import { defaultStore } from '@/store';
diff --git a/packages/frontend/src/pages/settings/plugin.vue b/packages/frontend/src/pages/settings/plugin.vue
index c2f80ceac2c6238b304954bba60437d2bfbbfa6a..b3459a2e2e0a30045fbf79430ac2b9840fe85f76 100644
--- a/packages/frontend/src/pages/settings/plugin.vue
+++ b/packages/frontend/src/pages/settings/plugin.vue
@@ -7,7 +7,7 @@
 		<div v-for="plugin in plugins" :key="plugin.id" class="_panel _gaps_s" style="padding: 20px;">
 			<span style="display: flex;"><b>{{ plugin.name }}</b><span style="margin-left: auto;">v{{ plugin.version }}</span></span>
 
-			<FormSwitch :model-value="plugin.active" @update:model-value="changeActive(plugin, $event)">{{ i18n.ts.makeActive }}</FormSwitch>
+			<MkSwitch :model-value="plugin.active" @update:model-value="changeActive(plugin, $event)">{{ i18n.ts.makeActive }}</MkSwitch>
 
 			<MkKeyValue>
 				<template #key>{{ i18n.ts.author }}</template>
@@ -34,7 +34,7 @@
 <script lang="ts" setup>
 import { nextTick, ref } from 'vue';
 import FormLink from '@/components/form/link.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormSection from '@/components/form/section.vue';
 import MkButton from '@/components/MkButton.vue';
 import MkKeyValue from '@/components/MkKeyValue.vue';
diff --git a/packages/frontend/src/pages/settings/privacy.vue b/packages/frontend/src/pages/settings/privacy.vue
index b0e59e79671f67d8147a4bca776ae2eceb45390c..5094638556ce3529e213045d0b53bc47db22a0b6 100644
--- a/packages/frontend/src/pages/settings/privacy.vue
+++ b/packages/frontend/src/pages/settings/privacy.vue
@@ -1,12 +1,12 @@
 <template>
 <div class="_gaps_m">
-	<FormSwitch v-model="isLocked" @update:model-value="save()">{{ i18n.ts.makeFollowManuallyApprove }}<template #caption>{{ i18n.ts.lockedAccountInfo }}</template></FormSwitch>
-	<FormSwitch v-if="isLocked" v-model="autoAcceptFollowed" @update:model-value="save()">{{ i18n.ts.autoAcceptFollowed }}</FormSwitch>
+	<MkSwitch v-model="isLocked" @update:model-value="save()">{{ i18n.ts.makeFollowManuallyApprove }}<template #caption>{{ i18n.ts.lockedAccountInfo }}</template></MkSwitch>
+	<MkSwitch v-if="isLocked" v-model="autoAcceptFollowed" @update:model-value="save()">{{ i18n.ts.autoAcceptFollowed }}</MkSwitch>
 
-	<FormSwitch v-model="publicReactions" @update:model-value="save()">
+	<MkSwitch v-model="publicReactions" @update:model-value="save()">
 		{{ i18n.ts.makeReactionsPublic }}
 		<template #caption>{{ i18n.ts.makeReactionsPublicDescription }}</template>
-	</FormSwitch>
+	</MkSwitch>
 		
 	<FormSelect v-model="ffVisibility" @update:model-value="save()">
 		<template #label>{{ i18n.ts.ffVisibility }}</template>
@@ -16,22 +16,22 @@
 		<template #caption>{{ i18n.ts.ffVisibilityDescription }}</template>
 	</FormSelect>
 		
-	<FormSwitch v-model="hideOnlineStatus" @update:model-value="save()">
+	<MkSwitch v-model="hideOnlineStatus" @update:model-value="save()">
 		{{ i18n.ts.hideOnlineStatus }}
 		<template #caption>{{ i18n.ts.hideOnlineStatusDescription }}</template>
-	</FormSwitch>
-	<FormSwitch v-model="noCrawle" @update:model-value="save()">
+	</MkSwitch>
+	<MkSwitch v-model="noCrawle" @update:model-value="save()">
 		{{ i18n.ts.noCrawle }}
 		<template #caption>{{ i18n.ts.noCrawleDescription }}</template>
-	</FormSwitch>
-	<FormSwitch v-model="isExplorable" @update:model-value="save()">
+	</MkSwitch>
+	<MkSwitch v-model="isExplorable" @update:model-value="save()">
 		{{ i18n.ts.makeExplorable }}
 		<template #caption>{{ i18n.ts.makeExplorableDescription }}</template>
-	</FormSwitch>
+	</MkSwitch>
 
 	<FormSection>
 		<div class="_gaps_m">
-			<FormSwitch v-model="rememberNoteVisibility" @update:model-value="save()">{{ i18n.ts.rememberNoteVisibility }}</FormSwitch>
+			<MkSwitch v-model="rememberNoteVisibility" @update:model-value="save()">{{ i18n.ts.rememberNoteVisibility }}</MkSwitch>
 			<FormFolder v-if="!rememberNoteVisibility">
 				<template #label>{{ i18n.ts.defaultNoteVisibility }}</template>
 				<template v-if="defaultNoteVisibility === 'public'" #suffix>{{ i18n.ts._visibility.public }}</template>
@@ -46,19 +46,19 @@
 						<option value="followers">{{ i18n.ts._visibility.followers }}</option>
 						<option value="specified">{{ i18n.ts._visibility.specified }}</option>
 					</FormSelect>
-					<FormSwitch v-model="defaultNoteLocalOnly">{{ i18n.ts._visibility.localOnly }}</FormSwitch>
+					<MkSwitch v-model="defaultNoteLocalOnly">{{ i18n.ts._visibility.localOnly }}</MkSwitch>
 				</div>
 			</FormFolder>
 		</div>
 	</FormSection>
 
-	<FormSwitch v-model="keepCw" @update:model-value="save()">{{ i18n.ts.keepCw }}</FormSwitch>
+	<MkSwitch v-model="keepCw" @update:model-value="save()">{{ i18n.ts.keepCw }}</MkSwitch>
 </div>
 </template>
 
 <script lang="ts" setup>
 import { } from 'vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormSelect from '@/components/form/select.vue';
 import FormSection from '@/components/form/section.vue';
 import FormFolder from '@/components/form/folder.vue';
diff --git a/packages/frontend/src/pages/settings/profile.vue b/packages/frontend/src/pages/settings/profile.vue
index 9727cf9c954c2f715040f792a113d9375e30a700..f7a2feb1990543fe577cd19447a606b6e5f53cf8 100644
--- a/packages/frontend/src/pages/settings/profile.vue
+++ b/packages/frontend/src/pages/settings/profile.vue
@@ -59,12 +59,12 @@
 		<template #label>{{ i18n.ts.advancedSettings }}</template>
 
 		<div class="_gaps_m">
-			<FormSwitch v-model="profile.isCat">{{ i18n.ts.flagAsCat }}<template #caption>{{ i18n.ts.flagAsCatDescription }}</template></FormSwitch>
-			<FormSwitch v-model="profile.isBot">{{ i18n.ts.flagAsBot }}<template #caption>{{ i18n.ts.flagAsBotDescription }}</template></FormSwitch>
+			<MkSwitch v-model="profile.isCat">{{ i18n.ts.flagAsCat }}<template #caption>{{ i18n.ts.flagAsCatDescription }}</template></MkSwitch>
+			<MkSwitch v-model="profile.isBot">{{ i18n.ts.flagAsBot }}<template #caption>{{ i18n.ts.flagAsBotDescription }}</template></MkSwitch>
 		</div>
 	</FormFolder>
 
-	<FormSwitch v-model="profile.showTimelineReplies">{{ i18n.ts.flagShowTimelineReplies }}<template #caption>{{ i18n.ts.flagShowTimelineRepliesDescription }} {{ i18n.ts.reflectMayTakeTime }}</template></FormSwitch>
+	<MkSwitch v-model="profile.showTimelineReplies">{{ i18n.ts.flagShowTimelineReplies }}<template #caption>{{ i18n.ts.flagShowTimelineRepliesDescription }} {{ i18n.ts.reflectMayTakeTime }}</template></MkSwitch>
 </div>
 </template>
 
@@ -73,7 +73,7 @@ import { reactive, watch } from 'vue';
 import MkButton from '@/components/MkButton.vue';
 import FormInput from '@/components/form/input.vue';
 import FormTextarea from '@/components/form/textarea.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormSelect from '@/components/form/select.vue';
 import FormSplit from '@/components/form/split.vue';
 import FormFolder from '@/components/form/folder.vue';
diff --git a/packages/frontend/src/pages/settings/reaction.vue b/packages/frontend/src/pages/settings/reaction.vue
index 95c3a8f5bba6d515e3b6e74e0649f233de4d9868..696a56dee5b8ccb74c75dd7eb0028d16778dfe91 100644
--- a/packages/frontend/src/pages/settings/reaction.vue
+++ b/packages/frontend/src/pages/settings/reaction.vue
@@ -39,10 +39,10 @@
 		<option :value="4">{{ i18n.ts.large }}+</option>
 	</FormRadios>
 
-	<FormSwitch v-model="reactionPickerUseDrawerForMobile">
+	<MkSwitch v-model="reactionPickerUseDrawerForMobile">
 		{{ i18n.ts.useDrawerReactionPickerForMobile }}
 		<template #caption>{{ i18n.ts.needReloadToApply }}</template>
-	</FormSwitch>
+	</MkSwitch>
 
 	<FormSection>
 		<div class="_buttons">
@@ -61,7 +61,7 @@ import FormRadios from '@/components/form/radios.vue';
 import FromSlot from '@/components/form/slot.vue';
 import MkButton from '@/components/MkButton.vue';
 import FormSection from '@/components/form/section.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import * as os from '@/os';
 import { defaultStore } from '@/store';
 import { i18n } from '@/i18n';
diff --git a/packages/frontend/src/pages/settings/statusbar.statusbar.vue b/packages/frontend/src/pages/settings/statusbar.statusbar.vue
index 890f92672eedc1bf2be2fb105b5662f77c0e65f3..ab62d40f31f0f330ca113497ad6cc3a9ada00f69 100644
--- a/packages/frontend/src/pages/settings/statusbar.statusbar.vue
+++ b/packages/frontend/src/pages/settings/statusbar.statusbar.vue
@@ -84,7 +84,7 @@
 import { computed, reactive, ref, watch } from 'vue';
 import FormSelect from '@/components/form/select.vue';
 import MkInput from '@/components/form/input.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormRadios from '@/components/form/radios.vue';
 import MkButton from '@/components/MkButton.vue';
 import FormRange from '@/components/form/range.vue';
diff --git a/packages/frontend/src/pages/settings/theme.vue b/packages/frontend/src/pages/settings/theme.vue
index a2dc9bc95f82c204e7d8f8e82d801c4f1cb95894..ab674b461cd0999f3a2db9636e7e63675a7cb3d7 100644
--- a/packages/frontend/src/pages/settings/theme.vue
+++ b/packages/frontend/src/pages/settings/theme.vue
@@ -22,7 +22,7 @@
 			</div>
 		</div>
 		<div class="sync">
-			<FormSwitch v-model="syncDeviceDarkMode">{{ i18n.ts.syncDeviceDarkMode }}</FormSwitch>
+			<MkSwitch v-model="syncDeviceDarkMode">{{ i18n.ts.syncDeviceDarkMode }}</MkSwitch>
 		</div>
 	</div>
 
@@ -68,7 +68,7 @@
 <script lang="ts" setup>
 import { computed, onActivated, ref, watch } from 'vue';
 import JSON5 from 'json5';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormSelect from '@/components/form/select.vue';
 import FormSection from '@/components/form/section.vue';
 import FormLink from '@/components/form/link.vue';
diff --git a/packages/frontend/src/pages/settings/webhook.edit.vue b/packages/frontend/src/pages/settings/webhook.edit.vue
index 8c8492ba5f622aec898ea802213db9a7d6f6ca20..828018b5aa41b7b69783a70abf7b4e1c0a2a2d0f 100644
--- a/packages/frontend/src/pages/settings/webhook.edit.vue
+++ b/packages/frontend/src/pages/settings/webhook.edit.vue
@@ -17,17 +17,17 @@
 		<template #label>Events</template>
 
 		<div class="_gaps_s">
-			<FormSwitch v-model="event_follow">Follow</FormSwitch>
-			<FormSwitch v-model="event_followed">Followed</FormSwitch>
-			<FormSwitch v-model="event_note">Note</FormSwitch>
-			<FormSwitch v-model="event_reply">Reply</FormSwitch>
-			<FormSwitch v-model="event_renote">Renote</FormSwitch>
-			<FormSwitch v-model="event_reaction">Reaction</FormSwitch>
-			<FormSwitch v-model="event_mention">Mention</FormSwitch>
+			<MkSwitch v-model="event_follow">Follow</MkSwitch>
+			<MkSwitch v-model="event_followed">Followed</MkSwitch>
+			<MkSwitch v-model="event_note">Note</MkSwitch>
+			<MkSwitch v-model="event_reply">Reply</MkSwitch>
+			<MkSwitch v-model="event_renote">Renote</MkSwitch>
+			<MkSwitch v-model="event_reaction">Reaction</MkSwitch>
+			<MkSwitch v-model="event_mention">Mention</MkSwitch>
 		</div>
 	</FormSection>
 
-	<FormSwitch v-model="active">Active</FormSwitch>
+	<MkSwitch v-model="active">Active</MkSwitch>
 
 	<div class="_buttons">
 		<MkButton primary inline @click="save"><i class="ti ti-check"></i> {{ i18n.ts.save }}</MkButton>
@@ -39,7 +39,7 @@
 import { } from 'vue';
 import FormInput from '@/components/form/input.vue';
 import FormSection from '@/components/form/section.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import MkButton from '@/components/MkButton.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
diff --git a/packages/frontend/src/pages/settings/webhook.new.vue b/packages/frontend/src/pages/settings/webhook.new.vue
index b408b6cb8864c386d62029b4f63fe35fdffa17fe..56e1dddc99531cb1e54665c1d2e5a03bb92d97a9 100644
--- a/packages/frontend/src/pages/settings/webhook.new.vue
+++ b/packages/frontend/src/pages/settings/webhook.new.vue
@@ -17,13 +17,13 @@
 		<template #label>Events</template>
 
 		<div class="_gaps_s">
-			<FormSwitch v-model="event_follow">Follow</FormSwitch>
-			<FormSwitch v-model="event_followed">Followed</FormSwitch>
-			<FormSwitch v-model="event_note">Note</FormSwitch>
-			<FormSwitch v-model="event_reply">Reply</FormSwitch>
-			<FormSwitch v-model="event_renote">Renote</FormSwitch>
-			<FormSwitch v-model="event_reaction">Reaction</FormSwitch>
-			<FormSwitch v-model="event_mention">Mention</FormSwitch>
+			<MkSwitch v-model="event_follow">Follow</MkSwitch>
+			<MkSwitch v-model="event_followed">Followed</MkSwitch>
+			<MkSwitch v-model="event_note">Note</MkSwitch>
+			<MkSwitch v-model="event_reply">Reply</MkSwitch>
+			<MkSwitch v-model="event_renote">Renote</MkSwitch>
+			<MkSwitch v-model="event_reaction">Reaction</MkSwitch>
+			<MkSwitch v-model="event_mention">Mention</MkSwitch>
 		</div>
 	</FormSection>
 
@@ -37,7 +37,7 @@
 import { } from 'vue';
 import FormInput from '@/components/form/input.vue';
 import FormSection from '@/components/form/section.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import MkButton from '@/components/MkButton.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
diff --git a/packages/frontend/src/pages/user-info.vue b/packages/frontend/src/pages/user-info.vue
index 5812eae9ff3e5b5621c142480db938fa7ec1ac2e..238c7e0fad70e2cc5a18219f43e5363b721d1bd1 100644
--- a/packages/frontend/src/pages/user-info.vue
+++ b/packages/frontend/src/pages/user-info.vue
@@ -87,9 +87,9 @@
 				</FormSection>
 			</div>
 			<div v-else-if="tab === 'moderation'" class="_gaps_m">
-				<FormSwitch v-if="user.host == null && $i.isAdmin && (moderator || !user.isAdmin)" v-model="moderator" @update:model-value="toggleModerator">{{ i18n.ts.moderator }}</FormSwitch>
-				<FormSwitch v-model="silenced" @update:model-value="toggleSilence">{{ i18n.ts.silence }}</FormSwitch>
-				<FormSwitch v-model="suspended" @update:model-value="toggleSuspend">{{ i18n.ts.suspend }}</FormSwitch>
+				<MkSwitch v-if="user.host == null && $i.isAdmin && (moderator || !user.isAdmin)" v-model="moderator" @update:model-value="toggleModerator">{{ i18n.ts.moderator }}</MkSwitch>
+				<MkSwitch v-model="silenced" @update:model-value="toggleSilence">{{ i18n.ts.silence }}</MkSwitch>
+				<MkSwitch v-model="suspended" @update:model-value="toggleSuspend">{{ i18n.ts.suspend }}</MkSwitch>
 				{{ i18n.ts.reflectMayTakeTime }}
 				<div>
 					<MkButton v-if="user.host == null && iAmModerator" inline style="margin-right: 8px;" @click="resetPassword"><i class="ti ti-key"></i> {{ i18n.ts.resetPassword }}</MkButton>
@@ -159,7 +159,7 @@ import * as misskey from 'misskey-js';
 import MkChart from '@/components/MkChart.vue';
 import MkObjectView from '@/components/MkObjectView.vue';
 import FormTextarea from '@/components/form/textarea.vue';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import FormLink from '@/components/form/link.vue';
 import FormSection from '@/components/form/section.vue';
 import MkButton from '@/components/MkButton.vue';