2 files changed, 51 insertions, 0 deletions
diff --git a/server/sonar-web/design-system/src/theme/colors.ts b/server/sonar-web/design-system/src/theme/colors.ts
index 785f6f07c8b..81bb8e5dd6d 100644
--- a/server/sonar-web/design-system/src/theme/colors.ts
+++ b/server/sonar-web/design-system/src/theme/colors.ts
@@ -133,4 +133,44 @@ export default {
     800: [49, 108, 146],
     900: [23, 67, 97],
   },
+  codeSnippetLight: {
+    body: [51, 53, 60],
+    annotations: [34, 84, 192],
+    constants: [126, 83, 5],
+    comments: [109, 111, 119],
+    keyword: [152, 29, 150],
+    string: [32, 105, 31],
+    'keyword-light': [28, 28, 163], // Not used currently in code snippet
+    'preprocessing-directive': [47, 103, 48],
+  },
+  codeSnippetDark: {
+    body: [241, 245, 253],
+    annotations: [137, 214, 255],
+    constants: [237, 182, 130],
+    comments: [156, 164, 175],
+    keyword: [251, 173, 255],
+    string: [177, 220, 146],
+    'keyword-light': [185, 185, 255], // Not used currently in code snippet
+    'preprocessing-directive': [133, 228, 134],
+  },
+  codeSyntaxLight: {
+    body: [56, 58, 66],
+    annotations: [35, 91, 213],
+    constants: [135, 87, 2],
+    comments: [95, 96, 102],
+    keyword: [162, 34, 160],
+    string: [36, 117, 35],
+    'keyword-light': [30, 30, 173],
+    'preprocessing-directive': [52, 114, 53],
+  },
+  codeSyntaxDark: {
+    body: [226, 231, 241],
+    annotations: [97, 174, 238],
+    constants: [209, 154, 102],
+    comments: [167, 172, 180],
+    keyword: [223, 145, 246],
+    string: [152, 195, 121],
+    'keyword-light': [171, 171, 255],
+    'preprocessing-directive': [120, 215, 121],
+  },
 };
diff --git a/server/sonar-web/design-system/src/theme/light.ts b/server/sonar-web/design-system/src/theme/light.ts
index fb4ddc7a1d0..dd154c09921 100644
--- a/server/sonar-web/design-system/src/theme/light.ts
+++ b/server/sonar-web/design-system/src/theme/light.ts
@@ -220,6 +220,16 @@ export const lightTheme = {
     codeLineIssueLocationSelected: [...danger.lighter, 0.5],
     codeLineIssueMessageTooltip: secondary.darker,
 
+    // code syntax highlight
+    codeSyntaxBody: COLORS.codeSyntaxLight.body,
+    codeSyntaxAnnotations: COLORS.codeSyntaxLight.annotations,
+    codeSyntaxConstants: COLORS.codeSyntaxLight.constants,
+    codeSyntaxComments: COLORS.codeSyntaxLight.comments,
+    codeSyntaxKeyword: COLORS.codeSyntaxLight.keyword,
+    codeSyntaxString: COLORS.codeSyntaxLight.string,
+    codeSyntaxKeywordLight: COLORS.codeSyntaxLight['keyword-light'],
+    codeSyntaxPreprocessingDirective: COLORS.codeSyntaxLight['preprocessing-directive'],
+
     // checkbox
     checkboxHover: COLORS.indigo[50],
     checkboxCheckedHover: primary.light,
@@ -248,6 +258,7 @@ export const lightTheme = {
     // tooltip
     tooltipBackground: COLORS.blueGrey[600],
     tooltipSeparator: secondary.dark,
+    tooltipHighlight: secondary.default,
 
     // avatar
     avatarBackground: COLORS.white,