diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4b08a76093..44692f5a6d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -6,6 +6,7 @@
 
 ### Client
 - Fix: 紙吹雪エフェクトがアニメーション設定を考慮せず常に表示される問題を修正
+- Fix: ナビゲーションバーのリアルタイムモード切替ボタンの状態をよりわかりやすく表示するように
 
 ### Server
 -
diff --git a/packages/frontend/src/ui/_common_/navbar.vue b/packages/frontend/src/ui/_common_/navbar.vue
index b0e45eafcd..f37e7ae85e 100644
--- a/packages/frontend/src/ui/_common_/navbar.vue
+++ b/packages/frontend/src/ui/_common_/navbar.vue
@@ -11,7 +11,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<img :src="instance.iconUrl || '/favicon.ico'" alt="" :class="$style.instanceIcon" style="viewTransitionName: navbar-serverIcon;"/>
 			</button>
 			<button v-if="!iconOnly" v-tooltip.noDelay.right="i18n.ts.realtimeMode" class="_button" :class="[$style.realtimeMode, store.r.realtimeMode.value ? $style.on : null]" @click="toggleRealtimeMode">
-				<i class="ti ti-bolt ti-fw"></i>
+				<i v-if="store.r.realtimeMode.value" class="ti ti-bolt ti-fw"></i>
+				<i v-else class="ti ti-bolt-off ti-fw"></i>
 			</button>
 		</div>
 		<div :class="$style.middle">
@@ -54,7 +55,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<i class="ti ti-apps ti-fw"></i>
 			</button>
 			<button v-if="iconOnly" v-tooltip.noDelay.right="i18n.ts.realtimeMode" class="_button" :class="[$style.realtimeMode, store.r.realtimeMode.value ? $style.on : null]" @click="toggleRealtimeMode">
-				<i class="ti ti-bolt ti-fw"></i>
+				<i v-if="store.r.realtimeMode.value" class="ti ti-bolt ti-fw"></i>
+				<i v-else class="ti ti-bolt-off ti-fw"></i>
 			</button>
 			<button v-tooltip.noDelay.right="i18n.ts.note" class="_button" :class="[$style.post]" data-cy-open-post-form @click="() => { os.post(); }">
 				<i class="ti ti-pencil ti-fw" :class="$style.postIcon"></i><span :class="$style.postText">{{ i18n.ts.note }}</span>