diff --git a/services/web/frontend/js/features/ide-react/scope-adapters/editor-manager-context-adapter.ts b/services/web/frontend/js/features/ide-react/scope-adapters/editor-manager-context-adapter.ts
index 7b2f49a6ad..370198fc84 100644
--- a/services/web/frontend/js/features/ide-react/scope-adapters/editor-manager-context-adapter.ts
+++ b/services/web/frontend/js/features/ide-react/scope-adapters/editor-manager-context-adapter.ts
@@ -1,4 +1,5 @@
 import { ReactScopeValueStore } from '@/features/ide-react/scope-value-store/react-scope-value-store'
+import customLocalStorage from '@/infrastructure/local-storage'
 
 export function populateEditorScope(
   store: ReactScopeValueStore,
@@ -23,8 +24,25 @@ export function populateEditorScope(
     newSourceEditor: true,
     error_state: false,
   })
-  store.persisted('editor.showVisual', false, `editor.mode.${projectId}`, {
-    toPersisted: showVisual => (showVisual ? 'rich-text' : 'source'),
-    fromPersisted: mode => mode === 'rich-text',
-  })
+  store.persisted(
+    'editor.showVisual',
+    showVisualFallbackValue(projectId),
+    `editor.lastUsedMode`,
+    {
+      toPersisted: showVisual => (showVisual ? 'visual' : 'code'),
+      fromPersisted: mode => mode === 'visual',
+    }
+  )
+}
+
+function showVisualFallbackValue(projectId: string) {
+  const editorModeKey = `editor.mode.${projectId}`
+  const editorModeVal = customLocalStorage.getItem(editorModeKey)
+
+  if (editorModeVal) {
+    // clean up the old key
+    customLocalStorage.removeItem(editorModeKey)
+  }
+
+  return editorModeVal === 'rich-text'
 }
diff --git a/services/web/frontend/js/ide/editor/EditorManager.js b/services/web/frontend/js/ide/editor/EditorManager.js
index 0f5f6c4229..49ae7a4517 100644
--- a/services/web/frontend/js/ide/editor/EditorManager.js
+++ b/services/web/frontend/js/ide/editor/EditorManager.js
@@ -22,6 +22,7 @@ import './controllers/CompileButton'
 import './controllers/SwitchToPDFButton'
 import '../metadata/services/metadata'
 import { debugConsole } from '@/utils/debugging'
+import customLocalStorage from '@/infrastructure/local-storage'
 
 let EditorManager
 
@@ -161,10 +162,20 @@ export default EditorManager = (function () {
     }
 
     showVisual() {
-      return (
-        this.localStorage(`editor.mode.${this.$scope.project_id}`) ===
-        'rich-text'
-      )
+      const editorModeKey = `editor.mode.${this.$scope.project_id}`
+      const editorModeVal = this.localStorage(editorModeKey)
+
+      if (editorModeVal) {
+        // clean up the old key
+        customLocalStorage.removeItem(editorModeKey)
+      }
+
+      const lastUsedMode = this.localStorage(`editor.lastUsedMode`)
+      if (lastUsedMode) {
+        return lastUsedMode === 'visual'
+      } else {
+        return editorModeVal === 'rich-text'
+      }
     }
 
     autoOpenDoc() {
diff --git a/services/web/frontend/js/ide/toolbar/EditorLoaderController.js b/services/web/frontend/js/ide/toolbar/EditorLoaderController.js
index d38d67a5af..1164e22157 100644
--- a/services/web/frontend/js/ide/toolbar/EditorLoaderController.js
+++ b/services/web/frontend/js/ide/toolbar/EditorLoaderController.js
@@ -5,10 +5,7 @@ App.controller('EditorLoaderController', [
   'localStorage',
   function ($scope, localStorage) {
     $scope.$watch('editor.showVisual', function (val) {
-      localStorage(
-        `editor.mode.${$scope.project_id}`,
-        val === true ? 'rich-text' : 'source'
-      )
+      localStorage(`editor.lastUsedMode`, val === true ? 'visual' : 'code')
     })
   },
 ])