diff --git a/app/react/components/CodeEditor/CodeEditor.tsx b/app/react/components/CodeEditor/CodeEditor.tsx
index d841400f0..c5904f28c 100644
--- a/app/react/components/CodeEditor/CodeEditor.tsx
+++ b/app/react/components/CodeEditor/CodeEditor.tsx
@@ -46,6 +46,10 @@ export const theme = createTheme({
     selectionMatch: 'var(--bg-codemirror-selected-color)',
   },
   styles: [
+    {
+      tag: [highlightTags.propertyName, highlightTags.attributeName],
+      color: 'var(--text-cm-default-color)',
+    },
     { tag: highlightTags.atom, color: 'var(--text-cm-default-color)' },
     { tag: highlightTags.meta, color: 'var(--text-cm-meta-color)' },
     {
diff --git a/app/react/components/CodeEditor/useCodeEditorExtensions.ts b/app/react/components/CodeEditor/useCodeEditorExtensions.ts
index 8050b59da..8f80b90f3 100644
--- a/app/react/components/CodeEditor/useCodeEditorExtensions.ts
+++ b/app/react/components/CodeEditor/useCodeEditorExtensions.ts
@@ -2,16 +2,11 @@ import { useMemo } from 'react';
 import {
   StreamLanguage,
   LanguageSupport,
-  syntaxHighlighting,
   indentService,
 } from '@codemirror/language';
 import { dockerFile } from '@codemirror/legacy-modes/mode/dockerfile';
 import { shell } from '@codemirror/legacy-modes/mode/shell';
-import {
-  oneDarkHighlightStyle,
-  keymap,
-  Extension,
-} from '@uiw/react-codemirror';
+import { keymap, Extension } from '@uiw/react-codemirror';
 import type { JSONSchema7 } from 'json-schema';
 import { lintKeymap, lintGutter } from '@codemirror/lint';
 import { defaultKeymap } from '@codemirror/commands';
@@ -45,7 +40,6 @@ function yamlLanguage(schema?: JSONSchema7) {
     linter,
     stateExtensions,
     yamlIndentExtension,
-    syntaxHighlighting(oneDarkHighlightStyle),
     // explicitly setting lineNumbers() as an extension ensures that the gutter order is the same between the diff viewer and the code editor
     lineNumbers(),
     !!schema && lintGutter(),