selection pin in out icon
selection-pin-in-out from Framework7 Icons by Vladimir Kharlampidi · Outline · MIT Free for personal and commercial use.
- Name
- selection-pin-in-out
- Set
- Framework7 Icons
- Style
- Outline
- Viewbox
- 56×56
- License
- MIT
Use the selection pin in out icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M17.861 43.216h21.371v5.682c-1.205.624-2.044 1.894-2.044 3.336c0 2.087 1.721 3.766 3.766 3.766a3.743 3.743 0 0 0 3.766-3.766a3.76 3.76 0 0 0-2.023-3.336V18.68c0-3.939-2.023-5.897-5.983-5.897H15.106V7.081a3.71 3.71 0 0 0 2.002-3.315A3.77 3.77 0 0 0 13.34 0a3.784 3.784 0 0 0-3.766 3.766c0 1.464.84 2.734 2.066 3.358v29.98c0 4.067 2.088 6.112 6.22 6.112m-.064-3.25c-1.787 0-2.69-.99-2.69-2.712v-21.22h21.435c1.786 0 2.69.99 2.69 2.712v21.22Z"/></svg>
React
import type { SVGProps } from "react";
export function F7SelectionPinInOut(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M17.861 43.216h21.371v5.682c-1.205.624-2.044 1.894-2.044 3.336c0 2.087 1.721 3.766 3.766 3.766a3.743 3.743 0 0 0 3.766-3.766a3.76 3.76 0 0 0-2.023-3.336V18.68c0-3.939-2.023-5.897-5.983-5.897H15.106V7.081a3.71 3.71 0 0 0 2.002-3.315A3.77 3.77 0 0 0 13.34 0a3.784 3.784 0 0 0-3.766 3.766c0 1.464.84 2.734 2.066 3.358v29.98c0 4.067 2.088 6.112 6.22 6.112m-.064-3.25c-1.787 0-2.69-.99-2.69-2.712v-21.22h21.435c1.786 0 2.69.99 2.69 2.712v21.22Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M17.861 43.216h21.371v5.682c-1.205.624-2.044 1.894-2.044 3.336c0 2.087 1.721 3.766 3.766 3.766a3.743 3.743 0 0 0 3.766-3.766a3.76 3.76 0 0 0-2.023-3.336V18.68c0-3.939-2.023-5.897-5.983-5.897H15.106V7.081a3.71 3.71 0 0 0 2.002-3.315A3.77 3.77 0 0 0 13.34 0a3.784 3.784 0 0 0-3.766 3.766c0 1.464.84 2.734 2.066 3.358v29.98c0 4.067 2.088 6.112 6.22 6.112m-.064-3.25c-1.787 0-2.69-.99-2.69-2.712v-21.22h21.435c1.786 0 2.69.99 2.69 2.712v21.22Z"/></svg> </template>
CSS
.icon-selection-pin-in-out {
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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M17.861%2043.216h21.371v5.682c-1.205.624-2.044%201.894-2.044%203.336c0%202.087%201.721%203.766%203.766%203.766a3.743%203.743%200%200%200%203.766-3.766a3.76%203.76%200%200%200-2.023-3.336V18.68c0-3.939-2.023-5.897-5.983-5.897H15.106V7.081a3.71%203.71%200%200%200%202.002-3.315A3.77%203.77%200%200%200%2013.34%200a3.784%203.784%200%200%200-3.766%203.766c0%201.464.84%202.734%202.066%203.358v29.98c0%204.067%202.088%206.112%206.22%206.112m-.064-3.25c-1.787%200-2.69-.99-2.69-2.712v-21.22h21.435c1.786%200%202.69.99%202.69%202.712v21.22Z%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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M17.861%2043.216h21.371v5.682c-1.205.624-2.044%201.894-2.044%203.336c0%202.087%201.721%203.766%203.766%203.766a3.743%203.743%200%200%200%203.766-3.766a3.76%203.76%200%200%200-2.023-3.336V18.68c0-3.939-2.023-5.897-5.983-5.897H15.106V7.081a3.71%203.71%200%200%200%202.002-3.315A3.77%203.77%200%200%200%2013.34%200a3.784%203.784%200%200%200-3.766%203.766c0%201.464.84%202.734%202.066%203.358v29.98c0%204.067%202.088%206.112%206.22%206.112m-.064-3.25c-1.787%200-2.69-.99-2.69-2.712v-21.22h21.435c1.786%200%202.69.99%202.69%202.712v21.22Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/f7/selection-pin-in-out.svg?color=%231a73e8&size=48
