Sorry, you need to enable JavaScript to visit this website.

Map Styler Documentation


Service version: 1
Last edit: 2019.06.28

On this page


The Customization Tool helps you modify a default TomTom style for vector maps. You are able to build your own map, edit its style, and export the result.

Top Menu


Styles can be imported into the Customization Tool for editing from the Open section in the Top Menu. Here you can select a JSON file from local storage, provide a URL, or choose one of the predefined formats.


A JSON file with styles can be downloaded locally using the Export menu item from the top menu.

Data sources

The Customization Tool supports Vector Tiles as a data source. It is also possible to provide your own source URL in the following formats: GeoJSON, XYZ, or TileJSON. Data sources can be configured from the Data Sources section in the Top Menu.

Style Settings

URLs for Glyphs and Sprites can be set at the Style Settings section in the Top Menu.


There are two view modes:

  • Map, which just displays the map with applied styles.
  • Inspect, which allows you to see all of the data layers on the map.


Reverts the recent change made in the editor.


Restores an action that has been previously undone using an Undo.

▲ Return to top


A new layer can be added using the Add Layer button. Layers are displayed in the same order as they are arranged in the layers tree in the left panel of the Customization Tool.

Layer attributes

Each layer in the Customization Tool has following attributes:

  • ID: The name of the layer.
  • Type: This can have one of the following values: Background, Fill, Line, Symbol, Raster, Circle, Fill Extrusion, Hillshade, Heatmap.
  • Source: The source of map data.
  • Source Layer: The map layer or entity to which the style should be applied.
  • Minzoom (optional): The minimum zoom level for the layer. At zoom levels less than the minzoom, the layer will be hidden.
  • Maxzoom (optional): The maximum zoom level for the layer. At zoom levels equal to or greater than the maxzoom, the layer will be hidden.

Source layer

There are multiple entities you can choose from depending on the Layer type. For further information see Tomtom's Vector Tiles documentation.

Layer types

  • Background: Represents the map's background.
  • Fill: An area-related feature.
  • Line: A line-related feature.
  • Symbol: Text or a special graphical symbol (like an arrow).
  • Raster: Raster map textures such as satellite imagery.
  • Circle: A filled circle.
  • Fill Extrusion: An extruded (3D) area.
  • Hillshade: Client-side hillshading visualization based on DEM data.
  • Heatmap: A heatmap visualization.

Layer properties

For the detailed specification of each layer in the style, visit the: Map Style Specification.

▲ Return to top