# Drawing features

_Last updated October 21, 2026_

> Draw points, lines, areas and text with the toolbar at the bottom of the editor, then reshape them any time.

> **Beta:** 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 support@squidmaps.io.

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

## The drawing tools

| Tool | Key | Use it for |
| --- | --- | --- |
| Select | 1 | Choosing, moving and reshaping features |
| Point | 2 | Single places |
| Line | 3 | Routes, paths and borders |
| Polygon | 4 | Areas such as parks or neighborhoods |
| Rectangle | 5 | Boxes, by dragging |
| Circle | 6 | Circles, by dragging from the center |
| Text | 7 | Words placed on the map |
| Route | 8 | Lines that follow streets, where available |

> **Tip:** Hold Shift as you choose a tool to keep drawing with it after each feature.

## Points

Choose the point tool and click the map. The point is added and selected.

## Lines and areas

1. Choose the line or polygon tool.
2. Click to place each vertex.
3. Double-click or press Enter to finish. Click an area's first vertex to close it.

## Rectangles and circles

Drag on the map. A rectangle starts upright and a circle is round on the map.

They keep their shape: drag a rectangle's corners or sides, or the handles on a circle's edge, to resize it, and drag the shape itself to move it. Drag the round handle above a rectangle to turn it (hold Shift to turn by 15°). A selected circle shows a crosshair at its center: drag it to line the circle up with something on the map. Type a circle's radius in the right panel, in meters, kilometers, miles or feet ("1.5 km"), or fine-tune it with the slider below. To move corners one at a time or add more, choose **Convert to area** in the right panel or the right-click menu.

## Text

Click where the words should go. Text is named after its words, and styled on its own. See [Styling data](https://squidmaps.io/docs/styling#text).

## Editing shapes

### Move vertices

Select a line or area, then drag a vertex. Drag a midpoint to add a vertex.

### Move and rotate

Hold the space bar and drag to move a whole feature. Hold Option and drag to rotate it.

### Delete

Select a feature and press Delete.

## Mask the map outside an area

To focus a map on one place, gray out everything around it. Select an area,
then choose **Add inverse mask** from the right-click menu or the
geometry operations menu. squidmaps adds a new area, named "Inverse of"
the original, that covers the whole world except your area, and lists it
just below it.

The mask starts as a dark fill at 60% opacity with no outline. Style it
like any other area: a lighter or more opaque fill, or a white one to fade
the map out instead. The original area is left as it was, so you can give
it an outline of its own.

```json
[
  {
    "type": "Feature",
    "id": "dc",
    "geometry": {
      "type": "Polygon",
      "coordinates": [
        [
          [-77.039, 38.7916],
          [-76.9094, 38.8929],
          [-77.0415, 38.9955],
          [-77.1198, 38.9341],
          [-77.1013, 38.9187],
          [-77.0832, 38.905],
          [-77.07, 38.902],
          [-77.056, 38.88],
          [-77.045, 38.87],
          [-77.04, 38.858],
          [-77.038, 38.845],
          [-77.039, 38.82],
          [-77.039, 38.7916]
        ]
      ]
    },
    "properties": {
      "name": "Washington, DC",
      "@line-color": "#12312C",
      "@fill-opacity": 0
    }
  },
  {
    "type": "Feature",
    "id": "dc-inverse",
    "geometry": {
      "type": "Polygon",
      "coordinates": [
        [
          [-180, -85.051129],
          [180, -85.051129],
          [180, 85.051129],
          [-180, 85.051129],
          [-180, -85.051129]
        ],
        [
          [-77.039, 38.7916],
          [-77.039, 38.82],
          [-77.038, 38.845],
          [-77.04, 38.858],
          [-77.045, 38.87],
          [-77.056, 38.88],
          [-77.07, 38.902],
          [-77.0832, 38.905],
          [-77.1013, 38.9187],
          [-77.1198, 38.9341],
          [-77.0415, 38.9955],
          [-76.9094, 38.8929],
          [-77.039, 38.7916]
        ]
      ]
    },
    "properties": {
      "name": "Inverse of Washington, DC",
      "@fill-color": "#1F2A2E",
      "@fill-opacity": 0.6,
      "@line-opacity": 0
    }
  }
]
```

The mask is made once from the area's shape. If you reshape the area
afterwards, delete the mask and add a new one. Holes in the area become
areas of their own in the mask, since they're outside it.

## Lock a feature

Lock a feature you've finished so it can't be changed by accident. Hover over
it in the features list and click the lock beside its name, or select it and
click the lock beside its name in the right panel. With features selected,
the lock locks or unlocks all of them.

A locked feature can still be selected, and still highlights in the list and
on the map as you hover over either. But it can't be moved, its vertices don't
appear, and its name, details and style are shown in the right panel without
being editable. Deleting skips locked features, and they're left out when you
move or rotate a group.

To edit it again, click its lock in the list, or the lock beside its name at
the top of the right panel. Visitors never see whether a feature is locked.
