diff --git a/lib/screens/history/history_widgets/his_request_pane.dart b/lib/screens/history/history_widgets/his_request_pane.dart
index a64b96f8..d4a65110 100644
--- a/lib/screens/history/history_widgets/his_request_pane.dart
+++ b/lib/screens/history/history_widgets/his_request_pane.dart
@@ -146,6 +146,7 @@ class HisRequestBody extends ConsumerWidget {
                           "${selectedHistoryModel?.historyId}-json-body-viewer",
                       initialValue: requestModel?.body,
                       readOnly: true,
+                      isDark: Theme.of(context).brightness == Brightness.dark,
                     ),
                   ),
                 _ => Padding(
diff --git a/lib/screens/home_page/editor_pane/details_card/request_pane/request_body.dart b/lib/screens/home_page/editor_pane/details_card/request_pane/request_body.dart
index 8c5a805d..e192f26e 100644
--- a/lib/screens/home_page/editor_pane/details_card/request_pane/request_body.dart
+++ b/lib/screens/home_page/editor_pane/details_card/request_pane/request_body.dart
@@ -20,7 +20,7 @@ class EditRequestBody extends ConsumerWidget {
         .select((value) => value?.httpRequestModel?.bodyContentType));
     final apiType = ref
         .watch(selectedRequestModelProvider.select((value) => value?.apiType));
-    final mode = ref.watch(settingsProvider.select(
+    final darkMode = ref.watch(settingsProvider.select(
       (value) => value.isDark,
     ));
 
@@ -49,7 +49,8 @@ class EditRequestBody extends ConsumerWidget {
                     padding: kPt5o10,
                     child: JsonTextFieldEditor(
                       key: Key("$selectedId-json-body"),
-                      fieldKey: "$selectedId-json-body-editor-$mode",
+                      fieldKey: "$selectedId-json-body-editor-$darkMode",
+                      isDark: darkMode,
                       initialValue: requestModel?.httpRequestModel?.body,
                       onChanged: (String value) {
                         ref
diff --git a/lib/widgets/editor_json.dart b/lib/widgets/editor_json.dart
index 5c00cb49..19f004ae 100644
--- a/lib/widgets/editor_json.dart
+++ b/lib/widgets/editor_json.dart
@@ -13,6 +13,7 @@ class JsonTextFieldEditor extends StatefulWidget {
     this.initialValue,
     this.hintText,
     this.readOnly = false,
+    this.isDark = false,
   });
 
   final String fieldKey;
@@ -20,6 +21,8 @@ class JsonTextFieldEditor extends StatefulWidget {
   final String? initialValue;
   final String? hintText;
   final bool readOnly;
+  final bool isDark;
+
   @override
   State<JsonTextFieldEditor> createState() => _JsonTextFieldEditorState();
 }
@@ -74,10 +77,8 @@ class _JsonTextFieldEditorState extends State<JsonTextFieldEditor> {
       controller.selection =
           TextSelection.collapsed(offset: controller.text.length);
     }
-    if (oldWidget.fieldKey != widget.fieldKey) {
-      // TODO: JsonTextField uses ExtendedTextField which does
-      // not rebuild because no key is provided
-      // so light mode to dark mode switching leads to incorrect color.
+    if ((oldWidget.fieldKey != widget.fieldKey) ||
+        (oldWidget.isDark != widget.isDark)) {
       setState(() {});
     }
   }
@@ -93,39 +94,40 @@ class _JsonTextFieldEditorState extends State<JsonTextFieldEditor> {
             },
           },
           child: JsonField(
-            key: Key(widget.fieldKey),
+            key: ValueKey("${widget.fieldKey}-fld"),
+            fieldKey: widget.fieldKey,
             commonTextStyle: kCodeStyle.copyWith(
-              color: Theme.of(context).brightness == Brightness.dark
+              color: widget.isDark
                   ? kDarkCodeTheme['root']?.color
                   : kLightCodeTheme['root']?.color,
             ),
             specialCharHighlightStyle: kCodeStyle.copyWith(
-              color: Theme.of(context).brightness == Brightness.dark
+              color: widget.isDark
                   ? kDarkCodeTheme['root']?.color
                   : kLightCodeTheme['root']?.color,
             ),
             stringHighlightStyle: kCodeStyle.copyWith(
-              color: Theme.of(context).brightness == Brightness.dark
+              color: widget.isDark
                   ? kDarkCodeTheme['string']?.color
                   : kLightCodeTheme['string']?.color,
             ),
             numberHighlightStyle: kCodeStyle.copyWith(
-              color: Theme.of(context).brightness == Brightness.dark
+              color: widget.isDark
                   ? kDarkCodeTheme['number']?.color
                   : kLightCodeTheme['number']?.color,
             ),
             boolHighlightStyle: kCodeStyle.copyWith(
-              color: Theme.of(context).brightness == Brightness.dark
+              color: widget.isDark
                   ? kDarkCodeTheme['literal']?.color
                   : kLightCodeTheme['literal']?.color,
             ),
             nullHighlightStyle: kCodeStyle.copyWith(
-              color: Theme.of(context).brightness == Brightness.dark
+              color: widget.isDark
                   ? kDarkCodeTheme['variable']?.color
                   : kLightCodeTheme['variable']?.color,
             ),
             keyHighlightStyle: kCodeStyle.copyWith(
-              color: Theme.of(context).brightness == Brightness.dark
+              color: widget.isDark
                   ? kDarkCodeTheme['attr']?.color
                   : kLightCodeTheme['attr']?.color,
               fontWeight: FontWeight.bold,
diff --git a/pubspec.lock b/pubspec.lock
index 3384355a..9881558d 100644
--- a/pubspec.lock
+++ b/pubspec.lock
@@ -832,7 +832,7 @@ packages:
       path: "packages/json_field_editor"
       relative: true
     source: path
-    version: "1.2.0"
+    version: "1.2.1"
   json_serializable:
     dependency: "direct dev"
     description: