diff --git a/routers/web/repo/editor.go b/routers/web/repo/editor.go
index fb1aaf042a..5a6e99f8aa 100644
--- a/routers/web/repo/editor.go
+++ b/routers/web/repo/editor.go
@@ -30,6 +30,8 @@ import (
 	"forgejo.org/services/context/upload"
 	"forgejo.org/services/forms"
 	files_service "forgejo.org/services/repository/files"
+
+	"github.com/editorconfig/editorconfig-core-go/v2"
 )
 
 const (
@@ -223,13 +225,22 @@ func editFile(ctx *context.Context, isNewFile bool) {
 	ctx.Data["last_commit"] = ctx.Repo.CommitID
 	ctx.Data["PreviewableExtensions"] = strings.Join(markup.PreviewableExtensions(), ",")
 	ctx.Data["LineWrapExtensions"] = strings.Join(setting.Repository.Editor.LineWrapExtensions, ",")
-	ctx.Data["EditorconfigJson"] = GetEditorConfig(ctx, treePath)
+	ctx.Data["EditorconfigJson"] = GetEditorConfigJSON(ctx, treePath)
 
 	ctx.HTML(http.StatusOK, tplEditFile)
 }
 
-// GetEditorConfig returns a editorconfig JSON string for given treePath or "null"
-func GetEditorConfig(ctx *context.Context, treePath string) string {
+// GetEditorConfig returns a editorconfig object for given treePath or nil
+func GetEditorConfig(ctx *context.Context, treePath string) (ec *editorconfig.Editorconfig) {
+	ec, _, err := ctx.Repo.GetEditorconfig()
+	if err == nil {
+		return ec
+	}
+	return nil
+}
+
+// GetEditorConfigJSON returns a editorconfig JSON string for given treePath or "null"
+func GetEditorConfigJSON(ctx *context.Context, treePath string) string {
 	ec, _, err := ctx.Repo.GetEditorconfig()
 	if err == nil {
 		def, err := ec.GetDefinitionForFilename(treePath)
@@ -274,7 +285,7 @@ func editFilePost(ctx *context.Context, form forms.EditRepoFileForm, isNewFile b
 	ctx.Data["last_commit"] = ctx.Repo.CommitID
 	ctx.Data["PreviewableExtensions"] = strings.Join(markup.PreviewableExtensions(), ",")
 	ctx.Data["LineWrapExtensions"] = strings.Join(setting.Repository.Editor.LineWrapExtensions, ",")
-	ctx.Data["EditorconfigJson"] = GetEditorConfig(ctx, form.TreePath)
+	ctx.Data["EditorconfigJson"] = GetEditorConfigJSON(ctx, form.TreePath)
 
 	if ctx.HasError() {
 		ctx.HTML(http.StatusOK, tplEditFile)
@@ -458,6 +469,7 @@ func DiffPreviewPost(ctx *context.Context) {
 		return
 	}
 	ctx.Data["File"] = diff.Files[0]
+	ctx.Data["Editorconfig"] = GetEditorConfig(ctx, treePath)
 
 	ctx.HTML(http.StatusOK, tplEditDiffPreview)
 }
diff --git a/templates/repo/editor/diff_preview.tmpl b/templates/repo/editor/diff_preview.tmpl
index e2e922be34..be36e84053 100644
--- a/templates/repo/editor/diff_preview.tmpl
+++ b/templates/repo/editor/diff_preview.tmpl
@@ -1,4 +1,4 @@
-<div class="diff-file-box">
+<div class="diff-file-box {{TabSizeClass $.Editorconfig .File.Name}}">
 	<div class="ui attached table segment">
 		<div class="file-body file-code code-diff code-diff-unified unicode-escaped">
 			<table>
diff --git a/web_src/js/features/codemirror.ts b/web_src/js/features/codemirror.ts
index f61449dccf..6c5bbd9217 100644
--- a/web_src/js/features/codemirror.ts
+++ b/web_src/js/features/codemirror.ts
@@ -188,7 +188,7 @@ export async function createCodemirror(
       codemirrorAutocomplete.autocompletion(),
       codemirrorCommands.history(),
       tabSize.of(
-        codemirrorState.EditorState.tabSize.of(editorOpts.tabSize || 4),
+        codemirrorState.EditorState.tabSize.of(editorOpts.indentSize || 4),
       ),
       wordWrap.of(
         editorOpts.wordWrap ? codemirrorView.EditorView.lineWrapping : [],