Creating a custom map pin icon

To match your branding, you can set up a custom map marker icon which will replace the standard red Google Maps icon on your locator's map.

Here are some tips for creating a custom icon:

Image file format

We recommend you or your designer create a PNG image for your map marker, as PNG is the only supported format that offers full transparency.

GIF and JPEG images are also supported, although JPEG does not support transparency (icons will always be rectangular) and GIF does not offer smooth transparency (so the icon edges may appear jagged).

Image file size

Since your image will be shown on the web, we recommend creating your image based on a size in pixels (rather than inches, which is the default in some tools).

We recommend creating a pin that's around 80 pixels high (which is the height of the standard red Google Maps pin icon) in order to display correctly on newer high-resolution (aka Retina) devices. However, if you only have an icon in the older 40px-high format, you can disable the use of retina-compatible icons on the "Style & colors" page of the app dashboard..

Once your image is created and saved, you may want to run it through a compression tool like  TinyPNG to reduce the file size.

Icon tips

The bottom center of the icon will be pinned to the geographical location of each store, so if you plan to feature a pinpoint in your icon, we suggest you anchor it there.

If you intend to use a transparent punchout, you may get better results by filling the punchout with the dominant background color of your map rather than using actual transparency. This can help reduce the feeling of clutter with overlapping icons:

The image on the left uses a transparent punchout, but uses a filled-in punchout on the right.


To display your pin icon to visitors, it'll need to be hosted online somewhere accessible. We don't currently offer image hosting, but you can upload your icon to the platform that hosts your site:

When you add the image URL to your Stockist account, be sure it starts with https:// to ensure there won't be any issues displaying your locator on a secure site.