diff --git a/scm-ui/ui-components/src/repos/DiffFile.tsx b/scm-ui/ui-components/src/repos/DiffFile.tsx
index fe35cc111f..87174ad72d 100644
--- a/scm-ui/ui-components/src/repos/DiffFile.tsx
+++ b/scm-ui/ui-components/src/repos/DiffFile.tsx
@@ -173,6 +173,18 @@ class DiffFile extends React.Component<Props, State> {
   };
 
   renderHunk = (hunk: HunkType, i: number) => {
+    let inConflict = false;
+    for (i = 0; i < hunk.changes.length; ++i) {
+      if (hunk.changes[i].content === "<<<<<<< HEAD") {
+        inConflict = true;
+      }
+      if (inConflict) {
+        hunk.changes[i].type = "conflict";
+      }
+      if (hunk.changes[i].content.startsWith(">>>>>>>")) {
+        inConflict = false;
+      }
+    }
     return [
       <Decoration key={"decoration-" + hunk.content}>{this.createHunkHeader(hunk, i)}</Decoration>,
       <Hunk
diff --git a/scm-ui/ui-components/src/repos/DiffTypes.ts b/scm-ui/ui-components/src/repos/DiffTypes.ts
index 635d5e93d8..592ac7b6db 100644
--- a/scm-ui/ui-components/src/repos/DiffTypes.ts
+++ b/scm-ui/ui-components/src/repos/DiffTypes.ts
@@ -27,7 +27,7 @@ export type Hunk = {
   content: string;
 };
 
-export type ChangeType = "insert" | "delete" | "normal";
+export type ChangeType = "insert" | "delete" | "normal" | "conflict";
 
 export type Change = {
   content: string;
diff --git a/scm-ui/ui-styles/src/scm.scss b/scm-ui/ui-styles/src/scm.scss
index 9f6a086541..bcb1fd4aa4 100644
--- a/scm-ui/ui-styles/src/scm.scss
+++ b/scm-ui/ui-styles/src/scm.scss
@@ -829,4 +829,12 @@ form .field:not(.is-grouped) {
   font-weight: 500 !important;
 }
 
+.diff-gutter-conflict {
+  background: $warning-50;
+}
+
+.diff-code-conflict {
+  background: $warning-25;
+}
+
 @import "bulma-popover/css/bulma-popover";