Guides

Custom basemaps

Make a basemap in your own colors, from one of squidmaps' basemaps, and use it on any of your maps.

squidmaps is in beta. Features, the map spec and these docs may change without notice, and things may occasionally break. Export a copy of any map that matters to you, and tell us when something isn't right: use Beta feedback, or email [email protected].

On this page

Make a custom basemap
Colors you can change
Examples
Use it on your maps
Undo and redo

In progress: This guide is being written. It outlines what it will cover.

Make a custom basemap

In the editor, open the basemap at the bottom of the left panel.
Choose Create a custom basemap.
Pick the basemap to start from: Streets, Light, Gray or Dark.
Change its colors and save it.

You can also make one from the Basemaps tab on your profile.

Colors you can change

Land and water, parks, buildings, roads and railways, boundaries, labels, and symbols like highway shields, each shown on a live preview as you go. Hover the preview to see which control styles what’s under the pointer.

Some things can also be made fainter or turned off: buildings, roads, railways, boundaries, labels, highway shields and points of interest. Fewer, quieter details let your own features stand out.

Examples

A few colors go a long way. Each of these changes a handful of controls on one of squidmaps’ basemaps.

Blueprint. Starts from Dark: deep blue land, navy water, pale blue roads, and no buildings.

Show the changes

json

{
  "name": "Blueprint",
  "description": "Starts from Dark: deep blue land, navy water, pale blue roads, and no buildings.",
  "base": "dark",
  "customizations": {
    "land": { "color": "#1C3D63" },
    "water": { "color": "#0F2742" },
    "parks": { "color": "#22507A" },
    "buildings": { "visible": false },
    "highways": { "color": "#BFE0FF" },
    "major_roads": { "color": "#8EC1F0" },
    "streets": { "color": "#4D7DAD" },
    "road_outlines": { "color": "#1C3D63" },
    "city_labels": { "color": "#DCEBFA" },
    "neighborhood_labels": { "color": "#9CC3E8" },
    "street_labels": { "color": "#9CC3E8" },
    "water_labels": { "color": "#6E9CC9" },
    "label_outlines": { "color": "#0F2742" }
  }
}

Parchment. Starts from Light: cream land, muted teal water, sage parks and fainter streets, for a warm, quiet map.

Show the changes

json

{
  "name": "Parchment",
  "description": "Starts from Light: cream land, muted teal water, sage parks and fainter streets, for a warm, quiet map.",
  "base": "light",
  "customizations": {
    "land": { "color": "#F3E9D2" },
    "water": { "color": "#9FC3BE" },
    "parks": { "color": "#C9D6A3" },
    "buildings": { "color": "#E6D8B8" },
    "highways": { "color": "#E2B66B" },
    "major_roads": { "color": "#FBF4E3" },
    "streets": { "color": "#FBF4E3", "opacity": 0.8 },
    "road_outlines": { "color": "#DDCDA8" },
    "city_labels": { "color": "#5B4632" },
    "neighborhood_labels": { "color": "#8A7259" },
    "street_labels": { "color": "#8A7259" },
    "water_labels": { "color": "#4F7F79" }
  }
}

Just the shape. Starts from Gray: little but land, water and faint highways, so your own features stand out.

Show the changes

json

{
  "name": "Just the shape",
  "description": "Starts from Gray: little but land, water and faint highways, so your own features stand out.",
  "base": "gray",
  "customizations": {
    "land": { "color": "#F4F5F4" },
    "water": { "color": "#C9D3D9" },
    "areas": { "visible": false },
    "buildings": { "visible": false },
    "highways": { "opacity": 0.35 },
    "major_roads": { "visible": false },
    "streets": { "visible": false },
    "railways": { "visible": false },
    "street_labels": { "visible": false },
    "address_labels": { "visible": false },
    "shields": { "visible": false }
  }
}

Tip: Start from the basemap closest to what you want: Dark for a dark map, Light or Gray for a quiet one. Then change only what you need.

Use it on your maps

Custom basemaps are saved to your account, so you can choose them for any of your maps. Changing one updates every map that uses it.

Undo and redo

Use ⌘ Z and ⌘ Shift Z while editing a basemap.