Skip to main content

Customize a Map Style

Estimated reading time: 2 minutes

Rename your style

In the upper left corner, click the style name (e.g., Basic), then type a new name (e.g., My Custom Style) to rename the style.

Set Resolution & Tags

Click the Settings button in the upper right corner.

Settings button

When the style settings dialog appears, select Mobile from the Resolution dropdown menu to ensure the style is optimized for an app running on a mobile phone.

Settings modal

You can add some tags and then click Save.

Customize your map

In this example, we will change the color of water, including seas and oceans:

  1. Click Background (the last option at the bottom), then click the 6-digit RGB hexadecimal code under Inner Color:. Replace it with #60cbea, then click outside the text field (in the white area of the page) to apply the change.

Style with Background option open

  1. Click the arrow to the left of Areas (just above Background) to expand the dropdown list of map areas you can color.

  2. Click Water Sea, then set its Inner Color to #60cbea as well.

  3. Click Water, then set its Inner Color to #60cbea as well."

Customize Style

You've just customized your first style! You can explore and customize other layers, change colors, add icons, adjust borders, and much more.

Click the back arrow in the upper left corner of the style window to return to your list of styles.

Arrow button

The new name and tags make it easier to identify. New style in list