1. Removed logic to blend selection with background with 0.3 opacity from ColorManager to a function in color namespace.

2. Changed the DomRenderer and CanvasRenderer where the function defined in color namespace is called.

src/browser/Color.ts

@@ -3,7 +3,7 @@
  * @license MIT
  */
 
-import { IColor } from 'browser/Types';
+import { IColor, IColorSet } from 'browser/Types';
 
 /**
  * Helper functions where the source type is "channels" (individual color channels as numbers).
@@ -47,6 +47,17 @@ export namespace color {
     const rgba = channels.toRgba(r, g, b);
     return { css, rgba };
   }
+  export function blendSelectionWithBgWithOpacity(colors: IColorSet, opacity: number=0.3): void {
+    const [selectionR, selectionG, selectionB, selectionA] = rgba.toChannels(colors.selection.rgba);
+    // The selection color is opaque. It needs to be blended with background color at 0.3 opacity Issue #2737
+    if (selectionA === 0xFF) {
+      const newAlpha: number = Math.round(opacity*255);
+      colors.selection = {
+        css: channels.toCss(selectionR, selectionG, selectionB, newAlpha),
+        rgba: channels.toRgba(selectionR, selectionG, selectionB, newAlpha)
+      };
+    }
+  }
 
   export function ensureContrastRatio(bg: IColor, fg: IColor, ratio: number): IColor | undefined {
     const result = rgba.ensureContrastRatio(bg.rgba, fg.rgba, ratio);