diff --git a/examples/algorithms.ts b/examples/algorithms.ts
index 0ad03ad21..55f4252a1 100644
--- a/examples/algorithms.ts
+++ b/examples/algorithms.ts
@@ -21,7 +21,7 @@ import {
   NoopAlgorithm,
   SuperClusterAlgorithm,
 } from "../src";
-import { MAP_ID, getLoaderOptions, sync } from "./config";
+import { MAP_ID, createMarker, getLoaderOptions, sync } from "./config";
 
 import { Loader } from "@googlemaps/js-api-loader";
 import trees from "./trees.json";
@@ -63,15 +63,8 @@ new Loader(getLoaderOptions()).load().then(() => {
 
     map.controls[google.maps.ControlPosition.LEFT_TOP].push(textElement);
 
-    const markers = trees.map(
-      ({ geometry }) =>
-        new google.maps.Marker({
-          position: {
-            lat: geometry.coordinates[1],
-            lng: geometry.coordinates[0],
-          },
-          map,
-        })
+    const markers = trees.map(({ geometry }) =>
+      createMarker(map, geometry.coordinates[1], geometry.coordinates[0])
     );
 
     new MarkerClusterer({
diff --git a/examples/config.ts b/examples/config.ts
index b1fb17bf2..24be8abfb 100644
--- a/examples/config.ts
+++ b/examples/config.ts
@@ -15,6 +15,7 @@
  */
 
 import { LoaderOptions } from "@googlemaps/js-api-loader";
+import { MarkerUtils } from "../src/marker-utils";
 
 export const MAP_ID = "DEMO_MAP_ID";
 
@@ -55,3 +56,20 @@ export const sync = (...maps: google.maps.Map[]): void => {
     });
   });
 };
+
+// Creates a marker.
+//
+// Prefers advanced markers when they are available.
+export function createMarker(map: google.maps.Map, lat: number, lng: number) {
+  if (MarkerUtils.isAdvancedMarkerAvailable(map)) {
+    return new google.maps.marker.AdvancedMarkerElement({
+      map,
+      position: { lat, lng },
+    });
+  }
+
+  return new google.maps.Marker({
+    position: { lat, lng },
+    map,
+  });
+}
diff --git a/examples/defaults.ts b/examples/defaults.ts
index 155939845..b13cf2699 100644
--- a/examples/defaults.ts
+++ b/examples/defaults.ts
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { MAP_ID, getLoaderOptions } from "./config";
+import { MAP_ID, createMarker, getLoaderOptions } from "./config";
 import { Loader } from "@googlemaps/js-api-loader";
 import { MarkerClusterer } from "../src";
 import trees from "./trees.json";
@@ -30,15 +30,8 @@ new Loader(getLoaderOptions()).load().then(() => {
 
   const map = new google.maps.Map(element, mapOptions);
 
-  const markers = trees.map(
-    ({ geometry }) =>
-      new google.maps.Marker({
-        position: {
-          lat: geometry.coordinates[1],
-          lng: geometry.coordinates[0],
-        },
-        map,
-      })
+  const markers = trees.map(({ geometry }) =>
+    createMarker(map, geometry.coordinates[1], geometry.coordinates[0])
   );
 
   const markerCluster = new MarkerClusterer({
diff --git a/examples/renderers.ts b/examples/renderers.ts
index 82262b3d5..afeefa311 100644
--- a/examples/renderers.ts
+++ b/examples/renderers.ts
@@ -21,7 +21,7 @@ import {
   MarkerClusterer,
   Renderer,
 } from "../src";
-import { MAP_ID, getLoaderOptions, sync } from "./config";
+import { MAP_ID, createMarker, getLoaderOptions, sync } from "./config";
 
 import { Loader } from "@googlemaps/js-api-loader";
 import { interpolateRgb } from "d3-interpolate";
@@ -108,15 +108,8 @@ new Loader(getLoaderOptions()).load().then(() => {
 
     map.controls[google.maps.ControlPosition.LEFT_TOP].push(textElement);
 
-    const markers = trees.map(
-      ({ geometry }) =>
-        new google.maps.Marker({
-          position: {
-            lat: geometry.coordinates[1],
-            lng: geometry.coordinates[0],
-          },
-          map,
-        })
+    const markers = trees.map(({ geometry }) =>
+      createMarker(map, geometry.coordinates[1], geometry.coordinates[0])
     );
 
     new MarkerClusterer({
diff --git a/examples/updates.ts b/examples/updates.ts
index dc5c60e1e..5578233f7 100644
--- a/examples/updates.ts
+++ b/examples/updates.ts
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { MAP_ID, getLoaderOptions } from "./config";
+import { MAP_ID, createMarker, getLoaderOptions } from "./config";
 import { Loader } from "@googlemaps/js-api-loader";
 import { MarkerClusterer } from "../src";
 import trees from "./trees.json";
@@ -30,14 +30,8 @@ new Loader(getLoaderOptions()).load().then(async () => {
 
   const map = new google.maps.Map(element, mapOptions);
 
-  const markers = trees.map(
-    ({ geometry }) =>
-      new google.maps.Marker({
-        position: {
-          lat: geometry.coordinates[1],
-          lng: geometry.coordinates[0],
-        },
-      })
+  const markers = trees.map(({ geometry }) =>
+    createMarker(map, geometry.coordinates[1], geometry.coordinates[0])
   );
 
   const markerCluster = new MarkerClusterer({
diff --git a/src/marker-utils.ts b/src/marker-utils.ts
index 4fe8a8c01..64801713a 100644
--- a/src/marker-utils.ts
+++ b/src/marker-utils.ts
@@ -24,6 +24,13 @@ export type Marker =
   | google.maps.marker.AdvancedMarkerElement;
 
 export class MarkerUtils {
+  public static isAdvancedMarkerAvailable(map: google.maps.Map): boolean {
+    return (
+      google.maps.marker &&
+      map.getMapCapabilities().isAdvancedMarkersAvailable === true
+    );
+  }
+
   public static isAdvancedMarker(
     marker: Marker
   ): marker is google.maps.marker.AdvancedMarkerElement {
diff --git a/src/renderer.ts b/src/renderer.ts
index 1b56ac3a0..d458683b9 100644
--- a/src/renderer.ts
+++ b/src/renderer.ts
@@ -15,7 +15,7 @@
  */
 
 import { Cluster } from "./cluster";
-import { Marker } from "./marker-utils";
+import { Marker, MarkerUtils } from "./marker-utils";
 
 /**
  * Provides statistics on all clusters in the current render cycle for use in {@link Renderer.render}.
@@ -51,7 +51,7 @@ export class ClusterStats {
 
 export interface Renderer {
   /**
-   * Turn a {@link Cluster} into a `google.maps.Marker`.
+   * Turn a {@link Cluster} into a `Marker`.
    *
    * Below is a simple example to create a marker with the number of markers in the cluster as a label.
    *
@@ -125,10 +125,8 @@ export class DefaultRenderer implements Renderer {
       // adjust zIndex to be above other markers
       zIndex: number = Number(google.maps.Marker.MAX_ZINDEX) + count;
 
-    if (
-      google.maps.marker &&
-      map.getMapCapabilities().isAdvancedMarkersAvailable
-    ) {
+    if (MarkerUtils.isAdvancedMarkerAvailable(map)) {
+      // create cluster SVG element
       const div = document.createElement("div");
       div.innerHTML = svg;
       const svgEl = div.firstElementChild;