diff --git a/src/Baseline.tsx b/src/Baseline.tsx
index 169464771..db200dda8 100644
--- a/src/Baseline.tsx
+++ b/src/Baseline.tsx
@@ -1,12 +1,19 @@
 import CssBaseline from "@material-ui/core/CssBaseline";
-import { createStyles, withStyles } from "@material-ui/core/styles";
+import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
+import { fade } from "@material-ui/core/styles/colorManipulator";
 import React from "react";
 
-const styles = createStyles({
+const styles = createStyles((theme: Theme) => ({
   "@global": {
-    "@import": "url('https://rsms.me/inter/inter.css')"
+    "@import": "url('https://rsms.me/inter/inter.css')",
+
+    // For some reason @import clause must be put on top
+    // eslint-disable-next-line sort-keys
+    "::selection": {
+      background: fade(theme.palette.primary.main, 0.2)
+    }
   }
-});
+}));
 
 const Baseline = withStyles(styles, {
   name: "Baseline"
diff --git a/src/components/RichTextEditor/RichTextEditor.tsx b/src/components/RichTextEditor/RichTextEditor.tsx
index b6cba3e1b..e85df71a8 100644
--- a/src/components/RichTextEditor/RichTextEditor.tsx
+++ b/src/components/RichTextEditor/RichTextEditor.tsx
@@ -39,7 +39,7 @@ const useStyles = makeStyles(
           minHeight: 24
         },
         "& .ce-block--selected .ce-block__content": {
-          background: `${fade(theme.palette.primary.main, 0.4)} !important`
+          background: `${fade(theme.palette.primary.main, 0.2)} !important`
         },
         "& .ce-block__content": {
           margin: 0,