Create a custom style

This guide will walk through how to create a custom style in the Mapbox Studio style editor. The Mapbox Studio Monochrome style is customizable, which lets you create a map style that conforms to your company's branding. This tutorial will show you how to customize the Mapbox Monochrome style by changing colors, fonts, and labels. After you have completed the tutorial, you will have created a map style that reflects the Mapbox brand colors at any zoom level and at any place across the world.

Learn how to create a new map style with Mapbox Studio.

Getting started​

You will need a few resources to get started:

• Mapbox account. Sign up for a free account on Mapbox.
• Style guidelines. It is often helpful to start a new custom map style with some broad style guidelines. Mapbox's brand has three primary colors (blue, gray, and pink) and a broader set of secondary colors. Every hue includes a dark, light, and faint variation. This tutorial will use a combination of these colors to style the background, water, buildings, and labels in a custom map style.

Create a new style​

Log in to your Mapbox account and open the Mapbox Studio styles page. This is where all your map styles are listed. A style is a set of rules that defines how Mapbox draws your map on the page. It includes references to your data, map images (icons, markers, and patterns), fonts, and defines how all your data should be styled on the map. For more information about styles, read the Styles section of the Mapbox Studio manual.

To create a new style from your Mapbox Studio styles page follow these steps:

1. Click the New style button
2. Find the Monochrome style
3. Click Customize Monochrome

The Mapbox Studio style editor will open, and you will be able to start creating a custom map style.

Customize your style​

The style editor​

The Mapbox Studio style editor is a visual tool for creating custom maps by applying styles to map features. There are two approaches to styling map features in Mapbox Studio:

• Components: A component is a collection of related map features of one or more types that you style as a single unit. Road network and administrative boundaries are examples of components. Each component contains several layers.
• Layers: A layer is a collection of map features of a single type (for example fill, line, or symbol). bridge-pedestrian is an example of a layer. In the Mapbox Streets style, bridge-pedestrian is one of more than 50 layers in the Road networkcomponent. Layers can be a part of a component, but don’t have to be.

Both components and layers have properties you can change to adjust the appearance of map features. In this section, you'll change colors applied to features throughout your map style using the Colors tab and change a few component properties in the Components tab.

But first, change the name of your new style. Click into the name field in the upper left side of the screen and change the name to Mapbox Style.

Adjust the color palette​

The Colors tab displays colors used throughout the style. There are over a dozen component color properties you can define in Mapbox template styles.

First, adjust the color assigned to the Base component color property:

1. Click the color swatch already listed in the Colors tab.
2. In the color picker, change the value to #edf0fd .