diff --git a/crates/editor/src/element.rs b/crates/editor/src/element.rs
index 7936ed76cb..928df1027f 100644
--- a/crates/editor/src/element.rs
+++ b/crates/editor/src/element.rs
@@ -1392,7 +1392,7 @@ impl EditorElement {
         } else {
             let style = &self.style;
             let chunks = snapshot
-                .chunks(rows.clone(), true, Some(style.theme.suggestion))
+                .chunks(rows.clone(), true, Some(style.theme.hint))
                 .map(|chunk| {
                     let mut highlight_style = chunk
                         .syntax_highlight_id
diff --git a/crates/theme/src/theme.rs b/crates/theme/src/theme.rs
index 0a62459a3a..e54dcdfd1e 100644
--- a/crates/theme/src/theme.rs
+++ b/crates/theme/src/theme.rs
@@ -689,6 +689,7 @@ pub struct Editor {
     pub line_number_active: Color,
     pub guest_selections: Vec<SelectionStyle>,
     pub syntax: Arc<SyntaxTheme>,
+    pub hint: HighlightStyle,
     pub suggestion: HighlightStyle,
     pub diagnostic_path_header: DiagnosticPathHeader,
     pub diagnostic_header: DiagnosticHeader,
diff --git a/styles/src/styleTree/editor.ts b/styles/src/styleTree/editor.ts
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/styles/src/style_tree/editor.ts b/styles/src/style_tree/editor.ts
index aeb84f678d..af58276d16 100644
--- a/styles/src/style_tree/editor.ts
+++ b/styles/src/style_tree/editor.ts
@@ -53,6 +53,7 @@ export default function editor(theme: ColorScheme): any {
         active_line_background: with_opacity(background(layer, "on"), 0.75),
         highlighted_line_background: background(layer, "on"),
         // Inline autocomplete suggestions, Co-pilot suggestions, etc.
+        hint: syntax.hint,
         suggestion: syntax.predictive,
         code_actions: {
             indicator: toggleable({
diff --git a/styles/src/theme/syntax.ts b/styles/src/theme/syntax.ts
index 148d600713..bfd3bd0138 100644
--- a/styles/src/theme/syntax.ts
+++ b/styles/src/theme/syntax.ts
@@ -17,6 +17,7 @@ export interface Syntax {
     "comment.doc": SyntaxHighlightStyle
     primary: SyntaxHighlightStyle
     predictive: SyntaxHighlightStyle
+    hint: SyntaxHighlightStyle
 
     // === Formatted Text ====== /
     emphasis: SyntaxHighlightStyle
@@ -146,12 +147,23 @@ function build_default_syntax(color_scheme: ColorScheme): Syntax {
             "lch"
         )
         .hex()
+    // Mix the neutral and green colors to get a
+    // hint color distinct from any other color in the theme
+    const hint = chroma
+        .mix(
+            color_scheme.ramps.neutral(0.6).hex(),
+            color_scheme.ramps.blue(0.4).hex(),
+            0.45,
+            "lch"
+        )
+        .hex()
 
     const color = {
         primary: color_scheme.ramps.neutral(1).hex(),
         comment: color_scheme.ramps.neutral(0.71).hex(),
         punctuation: color_scheme.ramps.neutral(0.86).hex(),
         predictive: predictive,
+        hint: hint,
         emphasis: color_scheme.ramps.blue(0.5).hex(),
         string: color_scheme.ramps.orange(0.5).hex(),
         function: color_scheme.ramps.yellow(0.5).hex(),
@@ -183,6 +195,11 @@ function build_default_syntax(color_scheme: ColorScheme): Syntax {
             color: color.predictive,
             italic: true,
         },
+        hint: {
+            color: color.hint,
+            weight: font_weights.bold,
+            // italic: true,
+        },
         emphasis: {
             color: color.emphasis,
         },