diff --git a/package.json b/package.json
index 05da6d14a5..92853dcbd0 100644
--- a/package.json
+++ b/package.json
@@ -239,7 +239,6 @@
     "ws": "^7.3.0"
   },
   "devDependencies": {
-    "@emeraldpay/hashicon-react": "^0.4.0",
     "@material-ui/core": "^4.10.1",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",
     "@testing-library/jest-dom": "^5.11.5",
diff --git a/src/renderer/components/cluster-icon/cluster-icon.scss b/src/renderer/components/cluster-icon/cluster-icon.scss
index 540cecf9eb..f246a8d9ee 100644
--- a/src/renderer/components/cluster-icon/cluster-icon.scss
+++ b/src/renderer/components/cluster-icon/cluster-icon.scss
@@ -7,25 +7,27 @@
   user-select: none;
   cursor: pointer;
 
-  &.interactive {
-    img {
-      opacity: .55;
-    }
+
+  div.MuiAvatar-colorDefault {
+    font-weight:500;
+    text-transform: uppercase;
+  }
+
+  div.active {
+    background-color: var(--primary);
+  }
+
+  div.default {
+    background-color: var(--halfGray);
   }
 
   &.active, &.interactive:hover {
     background-color: #fff;
-
-    img {
-      opacity: 1;
+    div {
+      background-color: var(--primary);
     }
   }
 
-  img {
-    width: var(--size);
-    height: var(--size);
-  }
-
   .Badge {
     position: absolute;
     right: 0;
@@ -35,4 +37,4 @@
     background: $colorError;
     color: white;
   }
-}
\ No newline at end of file
+}
diff --git a/src/renderer/components/cluster-icon/cluster-icon.tsx b/src/renderer/components/cluster-icon/cluster-icon.tsx
index 48d23eb91f..c7806e3ce3 100644
--- a/src/renderer/components/cluster-icon/cluster-icon.tsx
+++ b/src/renderer/components/cluster-icon/cluster-icon.tsx
@@ -2,14 +2,13 @@ import "./cluster-icon.scss";
 
 import React, { DOMAttributes } from "react";
 import { disposeOnUnmount, observer } from "mobx-react";
-import { Params as HashiconParams } from "@emeraldpay/hashicon";
-import { Hashicon } from "@emeraldpay/hashicon-react";
 import { Cluster } from "../../../main/cluster";
 import { cssNames, IClassName } from "../../utils";
 import { Badge } from "../badge";
 import { Tooltip } from "../tooltip";
 import { subscribeToBroadcast } from "../../../common/ipc";
 import { observable } from "mobx";
+import { Avatar } from "@material-ui/core";
 
 interface Props extends DOMAttributes<HTMLElement> {
   cluster: Cluster;
@@ -19,7 +18,6 @@ interface Props extends DOMAttributes<HTMLElement> {
   showTooltip?: boolean;
   interactive?: boolean;
   isActive?: boolean;
-  options?: HashiconParams;
 }
 
 const defaultProps: Partial<Props> = {
@@ -47,9 +45,29 @@ export class ClusterIcon extends React.Component<Props> {
     ]);
   }
 
+  get iconString() {
+    let splittedName = this.props.cluster.name.split(" ");
+
+    if (splittedName.length === 1) {
+      splittedName = splittedName[0].split("-");
+    }
+
+    if (splittedName.length === 1) {
+      splittedName = splittedName[0].split("@");
+    }
+
+    splittedName = splittedName.map((part) => part.replace(/\W/g, ""));
+
+    if (splittedName.length === 1) {
+      return splittedName[0].substring(0, 2);
+    } else {
+      return splittedName[0].substring(0, 1) + splittedName[1].substring(0, 1);
+    }
+  }
+
   render() {
     const {
-      cluster, showErrors, showTooltip, errorClass, options, interactive, isActive,
+      cluster, showErrors, showTooltip, errorClass, interactive, isActive,
       children, ...elemProps
     } = this.props;
     const { name, preferences, id: clusterId, online } = cluster;
@@ -67,7 +85,7 @@ export class ClusterIcon extends React.Component<Props> {
           <Tooltip targetId={clusterIconId}>{name}</Tooltip>
         )}
         {icon && <img src={icon} alt={name}/>}
-        {!icon && <Hashicon value={clusterId} options={options}/>}
+        {!icon && <Avatar variant="square" className={isActive ? "active" : "default"}>{this.iconString}</Avatar>}
         {showErrors && eventCount > 0 && !isActive && online && (
           <Badge
             className={cssNames("events-count", errorClass)}
diff --git a/yarn.lock b/yarn.lock
index 16ac2ca4f8..5d2d409d89 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -344,21 +344,6 @@
     global-agent "^2.0.2"
     global-tunnel-ng "^2.7.1"
 
-"@emeraldpay/hashicon-react@^0.4.0":
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/@emeraldpay/hashicon-react/-/hashicon-react-0.4.0.tgz#a05a1c9af23721a81450978fad816908fa3246b7"
-  integrity sha512-n+84V9R4g84B62NneYg5mz9Vf1xEBURZoyC4G1K9Rs9C7949D3SxgLhuXYyFKkNO5F5qzms5Qr3LGE5QNEdqJg==
-  dependencies:
-    "@emeraldpay/hashicon" "^0.4.0"
-    react "^16.8.0"
-
-"@emeraldpay/hashicon@^0.4.0":
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/@emeraldpay/hashicon/-/hashicon-0.4.0.tgz#0dcd4db6d589b4eb30495b9995ff66fc9e57f833"
-  integrity sha512-2EB6Z8gS/DK36+SslIuoHE8wdU6pBqljMTjIYxLC8hBN8n2yhhE+xdmifPjqfqOvF/7Wb5HmoNaPX6RGuBrasg==
-  dependencies:
-    js-sha3 "^0.8.0"
-
 "@emotion/cache@^10.0.27", "@emotion/cache@^10.0.9":
   version "10.0.29"
   resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.29.tgz#87e7e64f412c060102d589fe7c6dc042e6f9d1e0"
@@ -7967,11 +7952,6 @@ js-base64@^2.1.8:
   resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.5.2.tgz#313b6274dda718f714d00b3330bbae6e38e90209"
   integrity sha512-Vg8czh0Q7sFBSUMWWArX/miJeBWYBPpdU/3M/DKSaekLMqrqVPaedp+5mZhie/r0lgrcaYBfwXatEew6gwgiQQ==
 
-js-sha3@^0.8.0:
-  version "0.8.0"
-  resolved "https://registry.yarnpkg.com/js-sha3/-/js-sha3-0.8.0.tgz#b9b7a5da73afad7dedd0f8c463954cbde6818840"
-  integrity sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q==
-
 "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
@@ -11295,15 +11275,6 @@ react-zlib-js@^1.0.4:
   resolved "https://registry.yarnpkg.com/react-zlib-js/-/react-zlib-js-1.0.4.tgz#dd2b9fbf56d5ab224fa7a99affbbedeba9aa3dc7"
   integrity sha512-ynXD9DFxpE7vtGoa3ZwBtPmZrkZYw2plzHGbanUjBOSN4RtuXdektSfABykHtTiWEHMh7WdYj45LHtp228ZF1A==
 
-react@^16.8.0:
-  version "16.13.1"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.13.1.tgz#2e818822f1a9743122c063d6410d85c1e3afe48e"
-  integrity sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-    prop-types "^15.6.2"
-
 react@^17.0.1:
   version "17.0.1"
   resolved "https://registry.yarnpkg.com/react/-/react-17.0.1.tgz#6e0600416bd57574e3f86d92edba3d9008726127"