anchor icon
anchor from Material Design Icons by Pictogrammers · Filled · Transportation + Water · Apache-2.0 Free for personal and commercial use.
- Name
- anchor
- Set
- Material Design Icons
- Style
- Filled
- Category
- Transportation + Water
- Viewbox
- 24×24
- License
- Apache 2.0
The same icon in other sets
anchorBoxIcons v2anchorCarbonanchorEmoji One (Colored)anchorFont Awesome 6 SolidanchorFont Awesome SolidanchorFeather IconsanchorFluent EmojianchorFluent Emoji FlatanchorFluent Emoji High ContrastanchorFirefox OS Emojianchorcss.gganchorHuge IconsanchorIconParkanchorIconPark OutlineanchorIconPark SolidanchorIconPark TwoToneanchorJam IconsanchorLine AwesomeanchorLucideanchorMaterial SymbolsanchorMaterial Symbols Lightanchor-fillMingCute IconanchorMyna UI IconsanchorNoto Emoji
More transportation + water icons from Material Design Icons
Use the anchor icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2a3 3 0 0 0-3 3a3 3 0 0 0 2 2.83V9H8v2h3v8.92c-.74-.13-1.5-.34-2.21-.65c-.74-.32-1.39-.71-1.97-1.18s-1.04-.98-1.38-1.54L7 15l-4-3v3c0 .97.27 1.88.82 2.72A8.2 8.2 0 0 0 6 19.95c.87.64 1.84 1.14 2.88 1.5c1.05.36 2.09.55 3.12.55s2.07-.2 3.12-.56c1.04-.36 2.01-.86 2.88-1.49c.92-.64 1.63-1.38 2.18-2.23c.55-.84.82-1.75.82-2.72v-3l-4 3l1.56 1.55c-.34.56-.8 1.07-1.38 1.54s-1.23.86-1.97 1.18c-.71.31-1.47.52-2.21.65V11h3V9h-3V7.82A3 3 0 0 0 15 5a3 3 0 0 0-3-3m0 2a1 1 0 0 1 1 1a1 1 0 0 1-1 1a1 1 0 0 1-1-1a1 1 0 0 1 1-1"/></svg>
React
import type { SVGProps } from "react";
export function MdiAnchor(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2a3 3 0 0 0-3 3a3 3 0 0 0 2 2.83V9H8v2h3v8.92c-.74-.13-1.5-.34-2.21-.65c-.74-.32-1.39-.71-1.97-1.18s-1.04-.98-1.38-1.54L7 15l-4-3v3c0 .97.27 1.88.82 2.72A8.2 8.2 0 0 0 6 19.95c.87.64 1.84 1.14 2.88 1.5c1.05.36 2.09.55 3.12.55s2.07-.2 3.12-.56c1.04-.36 2.01-.86 2.88-1.49c.92-.64 1.63-1.38 2.18-2.23c.55-.84.82-1.75.82-2.72v-3l-4 3l1.56 1.55c-.34.56-.8 1.07-1.38 1.54s-1.23.86-1.97 1.18c-.71.31-1.47.52-2.21.65V11h3V9h-3V7.82A3 3 0 0 0 15 5a3 3 0 0 0-3-3m0 2a1 1 0 0 1 1 1a1 1 0 0 1-1 1a1 1 0 0 1-1-1a1 1 0 0 1 1-1"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2a3 3 0 0 0-3 3a3 3 0 0 0 2 2.83V9H8v2h3v8.92c-.74-.13-1.5-.34-2.21-.65c-.74-.32-1.39-.71-1.97-1.18s-1.04-.98-1.38-1.54L7 15l-4-3v3c0 .97.27 1.88.82 2.72A8.2 8.2 0 0 0 6 19.95c.87.64 1.84 1.14 2.88 1.5c1.05.36 2.09.55 3.12.55s2.07-.2 3.12-.56c1.04-.36 2.01-.86 2.88-1.49c.92-.64 1.63-1.38 2.18-2.23c.55-.84.82-1.75.82-2.72v-3l-4 3l1.56 1.55c-.34.56-.8 1.07-1.38 1.54s-1.23.86-1.97 1.18c-.71.31-1.47.52-2.21.65V11h3V9h-3V7.82A3 3 0 0 0 15 5a3 3 0 0 0-3-3m0 2a1 1 0 0 1 1 1a1 1 0 0 1-1 1a1 1 0 0 1-1-1a1 1 0 0 1 1-1"/></svg> </template>
CSS
.icon-anchor {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%202a3%203%200%200%200-3%203a3%203%200%200%200%202%202.83V9H8v2h3v8.92c-.74-.13-1.5-.34-2.21-.65c-.74-.32-1.39-.71-1.97-1.18s-1.04-.98-1.38-1.54L7%2015l-4-3v3c0%20.97.27%201.88.82%202.72A8.2%208.2%200%200%200%206%2019.95c.87.64%201.84%201.14%202.88%201.5c1.05.36%202.09.55%203.12.55s2.07-.2%203.12-.56c1.04-.36%202.01-.86%202.88-1.49c.92-.64%201.63-1.38%202.18-2.23c.55-.84.82-1.75.82-2.72v-3l-4%203l1.56%201.55c-.34.56-.8%201.07-1.38%201.54s-1.23.86-1.97%201.18c-.71.31-1.47.52-2.21.65V11h3V9h-3V7.82A3%203%200%200%200%2015%205a3%203%200%200%200-3-3m0%202a1%201%200%200%201%201%201a1%201%200%200%201-1%201a1%201%200%200%201-1-1a1%201%200%200%201%201-1%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%202a3%203%200%200%200-3%203a3%203%200%200%200%202%202.83V9H8v2h3v8.92c-.74-.13-1.5-.34-2.21-.65c-.74-.32-1.39-.71-1.97-1.18s-1.04-.98-1.38-1.54L7%2015l-4-3v3c0%20.97.27%201.88.82%202.72A8.2%208.2%200%200%200%206%2019.95c.87.64%201.84%201.14%202.88%201.5c1.05.36%202.09.55%203.12.55s2.07-.2%203.12-.56c1.04-.36%202.01-.86%202.88-1.49c.92-.64%201.63-1.38%202.18-2.23c.55-.84.82-1.75.82-2.72v-3l-4%203l1.56%201.55c-.34.56-.8%201.07-1.38%201.54s-1.23.86-1.97%201.18c-.71.31-1.47.52-2.21.65V11h3V9h-3V7.82A3%203%200%200%200%2015%205a3%203%200%200%200-3-3m0%202a1%201%200%200%201%201%201a1%201%200%200%201-1%201a1%201%200%200%201-1-1a1%201%200%200%201%201-1%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mdi/anchor.svg?color=%231a73e8&size=48
