# Liquid glass map callout: spec and references

Source: https://meniscus.site/components/map-callout · Updated 2026-10-02

Names the selected place on a map, floating above its pin. Layer: controls (over map content).

Also called: map label, place callout, pin callout, map annotation, map marker label.

| Property | Value |
|---|---|
| Material | regular |
| Profile | bevel |
| Geometry | one line: capsule 32–36 tall (36), radius h/2, padding 7 leading / 8 trailing; two lines: a rounded card radius 14–16 (16), padding 10, at most ~260 wide. 8 px above the pin's head; an optional tail 14–16 × 7 in the callout's own fill bridges that gap and points at the pin. Inside: a solid category glyph (a 22 circle in the capsule, a 32 tile radius 6 in the card: concentric, 16 − 10), the name 13–14 weight 600, a flat rating chip 20 tall, an optional detail line 12 |
| Bezel (px) | h/2 (18 at 36) · card: = radius (16) |
| Displacement (px) | 0.4 × bezel (7 · 6.5) |
| Blur (px) | 4–6 (map labels are busy content) |

## Anatomy

- glass capsule, or a rounded card for two lines
- flat category glyph on its solid colour
- name
- flat rating chip (white 52 % light / 18 % dark, amber star #A35F00 / #FFC24D)
- optional detail line (category, hours, distance)
- optional tail
- flat pin below: a solid category-colour teardrop, white glyph, 2 px white ring

## States

- rest
- selected: the pin grows from 26 to 34 and the callout grows out of it (§9 open)
- press: opens the place sheet

## Rules

- Pins stay flat map content; only the callout is glass.
- One callout at a time, for the selected place; other places show pins or plain map labels, never a field of glass labels.
- One line is a capsule; a second line turns it into a radius-16 card, never a taller capsule.
- Over busy map labels keep regular glass at the top of its blur range, so the street names under it read as texture, not text.
- Category colours carry white glyphs at 3:1 or more (#D9622B, #7A4FD6, #2E9D5B, #D93D4A, #2B6BFF).

## Reference renders

The tool attaches these images; each shows:

- Glass place callouts on a light procedural street map: a two-line callout above a selected purple pin, a one-line callout above a coffee pin, flat category pins, a river, a blue route and a yellow road. (light)
- Glass place callouts on a dark procedural street map: a two-line callout above a selected purple pin, a one-line callout above a coffee pin, flat category pins, a river, a blue route and a yellow road. (dark)

## Use it with your assistant

This spec is what the Meniscus MCP server's `get_spec` tool returns for `map-callout`. Materials, colours, light and composition rules that apply to every component are in the [liquid glass guide](https://meniscus.site/liquid-glass). Connect: `claude mcp add --transport http meniscus https://meniscus.site/mcp` — setup for every client: https://meniscus.site/docs