PNG
License
Spatly Marks are free to use in personal and commercial projects. Attribution is appreciated, not required. Do not resell the set as-is.
UI icons
Eye Off
A free SVG map icon from Spatly Marks, an original first-party kit. Recolour and export it below, or open it straight in the studio.
SVG source
html
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" data-mark="eye-off" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M2.5 12c3-4.5 6.2-6.5 9.5-6.5s6.5 2 9.5 6.5c-3 4.5-6.2 6.5-9.5 6.5S5.5 16.5 2.5 12z"/><circle cx="12" cy="12" r="2.75"/><path d="M3.5 3.5l17 17" stroke="var(--sp-color-surface, #fff)" stroke-width="3.5"/><path d="M3.5 3.5l17 17"/></svg>
How to use Eye Off
MapLibre GL
ts
import { markDataUrl } from "@spatly/marks";
map.loadImage(markDataUrl("eye-off", { size: 64 }), (err, img) => {
if (!err && img) map.addImage("eye-off", img);
});
Leaflet
ts
import { markDataUrl } from "@spatly/marks";
const icon = L.icon({
iconUrl: markDataUrl("eye-off", { size: 48, fill: "#e81860" }),
iconSize: [24, 24],
iconAnchor: [12, 12],
});
L.marker([41.0082, 28.9784], { icon }).addTo(map);
HTML
html
<!-- Paste the SVG straight in, or reference a saved file -->
<img src="eye-off.svg" width="24" height="24" alt="Eye Off" />
React
tsx
import { Mark } from "@spatly/marks";
<Mark name="eye-off" size={24} />
Similar marks
Use Eye Off on your own map.
Spatly Marks power every layer and annotation in the studio. Drop a GeoJSON and place them on live data.
41.0082°N 28.9784°E · z 11.3 · ⟂ 0°