diff --git a/CHANGELOG_CHERRYPICK.md b/CHANGELOG_CHERRYPICK.md
index e3e7df80f1..d1653ea4dc 100644
--- a/CHANGELOG_CHERRYPICK.md
+++ b/CHANGELOG_CHERRYPICK.md
@@ -34,6 +34,7 @@
 - 리액션 버튼 디자인 개선
 - 새 글꼴 크기 추가
 - 위젯 편집 시 버튼의 디자인 개선
+- 글꼴 크기를 보다 쉽게 변경할 수 있도록
 - Fix: (Friendly) 위젯 영역에 safe-area-inset-bottom이 적용되지 않음
 - Fix: 위젯 편집 시 헤더 이외의 영역을 눌렀을 때 위젯 설정이 뜨는 문제
 - Fix: 위젯 편집 종료 버튼이 여러 개 있는 문제
diff --git a/locales/en-US.yml b/locales/en-US.yml
index f9754b1ea3..2b59e32ae2 100644
--- a/locales/en-US.yml
+++ b/locales/en-US.yml
@@ -744,6 +744,7 @@ center: "Center"
 wide: "Wide"
 narrow: "Narrow"
 reloadToApplySetting: "This setting will only apply after a page reload. Reload now?"
+reloadToApplySetting2: "This setting will only apply after a page reload."
 needReloadToApply: "A reload is required for this to be reflected."
 showTitlebar: "Show title bar"
 clearCache: "Clear cache"
diff --git a/locales/index.d.ts b/locales/index.d.ts
index d87561c08a..32ce98f200 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -749,6 +749,7 @@ export interface Locale {
     "wide": string;
     "narrow": string;
     "reloadToApplySetting": string;
+    "reloadToApplySetting2": string;
     "needReloadToApply": string;
     "showTitlebar": string;
     "clearCache": string;
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index e4c96ae5f8..f36143d81e 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -746,6 +746,7 @@ center: "中央"
 wide: "広い"
 narrow: "狭い"
 reloadToApplySetting: "設定はページリロード後に反映されます。今すぐリロードしますか？"
+reloadToApplySetting2: "設定はページリロード後に反映されます。"
 needReloadToApply: "反映には再起動が必要です。"
 showTitlebar: "タイトルバーを表示する"
 clearCache: "キャッシュをクリア"
diff --git a/locales/ko-KR.yml b/locales/ko-KR.yml
index d2efb433eb..a7776bc7a8 100644
--- a/locales/ko-KR.yml
+++ b/locales/ko-KR.yml
@@ -745,6 +745,7 @@ center: "가운데"
 wide: "넓게"
 narrow: "좁게"
 reloadToApplySetting: "이 설정을 적용하려면 페이지를 다시 불러와야 해요. 지금 페이지를 새로 고칠까요?"
+reloadToApplySetting2: "이 설정을 적용하려면 페이지를 다시 불러와야 해요."
 needReloadToApply: "변경 사항은 페이지를 다시 불러오면 적용돼요."
 showTitlebar: "타이틀 바를 표시하기"
 clearCache: "캐시 비우기"
diff --git a/packages/frontend/src/pages/settings/general.vue b/packages/frontend/src/pages/settings/general.vue
index 6af195c939..6015a2dc2e 100644
--- a/packages/frontend/src/pages/settings/general.vue
+++ b/packages/frontend/src/pages/settings/general.vue
@@ -120,6 +120,7 @@
 				<div style="margin: 8px 0 0 0; font-size: 1.5em;"><Mfm :key="emojiStyle" text="🍮🍦🍭🍩🍰🍫🍬🥞🍪"/></div>
 			</div>
 
+			<!--
 			<MkRadios v-model="fontSize">
 				<template #label>{{ i18n.ts.fontSize }}</template>
 				<option value="1"><span style="font-size: 12px;">Aa</span></option>
@@ -132,6 +133,57 @@
 				<option value="7"><span style="font-size: 19px;">Aa</span></option>
 				<option value="8"><span style="font-size: 20px;">Aa</span></option>
 			</MkRadios>
+			-->
+
+			<div>
+				<div class="label">{{ i18n.ts.fontSize }}</div>
+				<div class="fontSize _panel">
+					<div v-if="fontSize === 1" style="font-size: 7px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 2" style="font-size: 8px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 3" style="font-size: 9px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 4" style="font-size: 10px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 5" style="font-size: 11px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 6" style="font-size: 12px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 7" style="font-size: 13px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 8" style="font-size: 14px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 9" style="font-size: 15px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 10" style="font-size: 16px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 11" style="font-size: 17px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 12" style="font-size: 18px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 13" style="font-size: 19px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 14" style="font-size: 20px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 15" style="font-size: 21px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 16" style="font-size: 22px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 17" style="font-size: 23px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 18" style="font-size: 24px;">{{ i18n.ts._mfm.dummy }}</div>
+					<div v-if="fontSize === 19" style="font-size: 25px;">{{ i18n.ts._mfm.dummy }}</div>
+				</div>
+				<div class="fontSize_slider">
+					<MkRange v-model="fontSize" :min="1" :max="19" :step="1" easing :textConverter="(v) =>
+						v === 1 ? '7px' :
+						v === 2 ? '8px' :
+						v === 3 ? '9px' :
+						v === 4 ? '10px' :
+						v === 5 ? '11px' :
+						v === 6 ? '12px' :
+						v === 7 ? '13px' :
+						v === 8 ? '14px' :
+						v === 9 ? '15px' :
+						v === 10 ? '16px' :
+						v === 11 ? '17px' :
+						v === 12 ? '18px' :
+						v === 13 ? '19px' :
+						v === 14 ? '20px' :
+						v === 15 ? '21px' :
+						v === 16 ? '22px' :
+						v === 17 ? '23px' :
+						v === 18 ? '24px' :
+						v === 19 ? '25px' : ''"
+					>
+					</MkRange>
+				</div>
+				<MkInfo v-if="fontSize != fontSizeBefore" style="margin-top: 15px;">{{ i18n.ts.reloadToApplySetting2 }}</MkInfo>
+			</div>
 		</div>
 	</FormSection>
 
@@ -176,7 +228,7 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, ref, watch } from 'vue';
+import { computed, onMounted, ref, watch } from 'vue';
 import MkSwitch from '@/components/MkSwitch.vue';
 import MkSelect from '@/components/MkSelect.vue';
 import MkRadios from '@/components/MkRadios.vue';
@@ -191,11 +243,14 @@ import { unisonReload } from '@/scripts/unison-reload';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
 import { miLocalStorage } from '@/local-storage';
+import MkInfo from "@/components/MkInfo.vue";
 
 const lang = ref(miLocalStorage.getItem('lang'));
-const fontSize = ref(miLocalStorage.getItem('fontSize'));
+// const fontSize = ref(miLocalStorage.getItem('fontSize'));
 const useSystemFont = ref(miLocalStorage.getItem('useSystemFont') != null);
 
+const fontSizeBefore = ref(miLocalStorage.getItem('fontSize'));
+
 async function reloadAsk() {
 	const { canceled } = await os.confirm({
 		type: 'info',
@@ -240,6 +295,7 @@ const showTimelineReplies = computed(defaultStore.makeGetterSetter('showTimeline
 const useEnterToSend = computed(defaultStore.makeGetterSetter('useEnterToSend'));
 const postFormVisibilityHotkey = computed(defaultStore.makeGetterSetter('postFormVisibilityHotkey'));
 const newNoteRecivedNotificationBehavior = computed(defaultStore.makeGetterSetter('newNoteRecivedNotificationBehavior'));
+const fontSize = computed(defaultStore.makeGetterSetter('fontSize'));
 
 watch(lang, () => {
 	miLocalStorage.setItem('lang', lang.value as string);
@@ -250,7 +306,7 @@ watch(fontSize, () => {
 	if (fontSize.value == null) {
 		miLocalStorage.removeItem('fontSize');
 	} else {
-		miLocalStorage.setItem('fontSize', fontSize.value);
+		miLocalStorage.setItem('fontSize', fontSize.value as string);
 	}
 });
 
@@ -266,7 +322,7 @@ watch([
 	lang,
 	animatedMfm,
 	useBlurEffect,
-	fontSize,
+	// fontSize,
 	useSystemFont,
 	enableInfiniteScroll,
 	squareAvatars,
@@ -278,6 +334,12 @@ watch([
 	await reloadAsk();
 });
 
+onMounted(() => {
+	if (fontSizeBefore.value == null) {
+		fontSizeBefore.value = fontSize.value as string;
+	}
+});
+
 const headerActions = $computed(() => []);
 
 const headerTabs = $computed(() => []);
@@ -287,3 +349,22 @@ definePageMetadata({
 	icon: 'ti ti-adjustments',
 });
 </script>
+
+<style lang="scss" scoped>
+.label {
+	font-size: 0.85em;
+	padding: 0 0 8px 0;
+	user-select: none;
+}
+
+.fontSize {
+	padding: 20px 20px 28px;
+	border-radius: 6px;
+	text-align: center;
+}
+
+.fontSize_slider {
+	margin-top: -8px;
+	border-top: solid .5px var(--divider);
+}
+</style>
diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts
index 612a00a18b..f4dc9ea0c5 100644
--- a/packages/frontend/src/store.ts
+++ b/packages/frontend/src/store.ts
@@ -351,6 +351,10 @@ export const defaultStore = markRaw(new Storage('base', {
 		where: 'device',
 		default: 'count' as 'default' | 'count' | 'none',
 	},
+	fontSize: {
+		where: 'device',
+		default: 8,
+	},
 }));
 
 // TODO: 他のタブと永続化されたstateを同期