diff --git a/packages/front/src/core/Marker/index.ts b/packages/front/src/core/Marker/index.ts
index cc96d2751..dc21cade0 100644
--- a/packages/front/src/core/Marker/index.ts
+++ b/packages/front/src/core/Marker/index.ts
@@ -89,6 +89,24 @@ export class Marker extends OBC.Component implements OBC.Disposable {
    */
   autoCluster = true;
 
+  private static readonly DEFAULT_CLUSTER_STYLES = {
+    backgroundColor: "#FFFFFF",
+    textColor: "#000000",
+    fontSize: "1.2rem",
+    fontWeight: "500",
+    borderRadius: "50%",
+    padding: "5px 11px",
+    textAlign: "center",
+    cursor: "pointer",
+    hoverBackgroundColor: "#BCF124",
+    transition: undefined,
+  };
+
+  // Customizable cluster element styles
+  clusterElementStyles: Partial<typeof Marker.DEFAULT_CLUSTER_STYLES> = {
+    ...Marker.DEFAULT_CLUSTER_STYLES,
+  };
+
   /**
    * A Map containing the markers grouped by world UUID.
    * Each world can have its own set of markers.
@@ -418,24 +436,40 @@ export class Marker extends OBC.Component implements OBC.Disposable {
   private createClusterElement(key: string) {
     const div = document.createElement("div");
     div.textContent = key;
-    div.style.color = "#000000";
-    div.style.background = "#FFFFFF";
-    div.style.fontSize = "1.2rem";
-    div.style.fontWeight = "500";
-    div.style.pointerEvents = "auto";
-    div.style.borderRadius = "50%";
-    div.style.padding = "5px 11px";
-    div.style.textAlign = "center";
-    div.style.cursor = "pointer";
-    // div.style.transition = "all 0.05s";
+
+    const {
+      backgroundColor,
+      textColor,
+      fontSize,
+      fontWeight,
+      borderRadius,
+      padding,
+      textAlign,
+      cursor,
+      hoverBackgroundColor,
+      transition,
+    } = { ...Marker.DEFAULT_CLUSTER_STYLES, ...this.clusterElementStyles };
+
+    Object.assign(div.style, {
+      background: backgroundColor,
+      color: textColor,
+      fontSize,
+      fontWeight,
+      borderRadius,
+      padding,
+      textAlign,
+      cursor,
+      ...(transition && { transition }),
+    });
+
     div.addEventListener("pointerdown", () => {
       this.navigateToCluster(key);
     });
     div.addEventListener("pointerover", () => {
-      div.style.background = "#BCF124";
+      div.style.background = hoverBackgroundColor;
     });
     div.addEventListener("pointerout", () => {
-      div.style.background = "#FFFFFF";
+      div.style.background = backgroundColor;
     });
     return div;
   }