view 2d icon
view-2d from Framework7 Icons by Vladimir Kharlampidi · Outline · MIT Free for personal and commercial use.
- Name
- view-2d
- Set
- Framework7 Icons
- Style
- Outline
- Viewbox
- 56×56
- License
- MIT
Related icons in Framework7 Icons
Use the view 2d icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M2.024 44.969h19.334c1.186 0 1.93-.745 1.93-1.885c0-1.117-.744-1.861-1.93-1.861H5.863v-.117l9.097-8.84c5.537-5.375 7.165-8.167 7.165-11.75c0-5.327-4.722-9.399-11.027-9.399c-4.956 0-9.19 2.676-10.61 6.77C.21 18.68.1 19.33.1 19.912c0 1.163.691 1.93 1.831 1.93c1.094 0 1.559-.511 1.908-1.674c.186-.722.442-1.373.814-1.978c1.233-2.07 3.537-3.397 6.445-3.397c3.769 0 6.77 2.653 6.77 5.956c0 2.676-1.093 4.49-5.7 9.027L1.28 40.595C.303 41.572 0 42.154 0 43.015c0 1.21.791 1.954 2.024 1.954m27.989-.047h9.538C49.974 44.922 56 38.71 56 28.217s-6.026-16.565-16.449-16.565h-9.539c-1.28 0-2.093.838-2.093 2.14v28.966c0 1.326.814 2.164 2.093 2.164m2.117-3.815V15.42h7.119c8.003 0 12.447 4.654 12.447 12.82c0 8.212-4.444 12.865-12.447 12.865Z"/></svg>
React
import type { SVGProps } from "react";
export function F7View2d(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="M2.024 44.969h19.334c1.186 0 1.93-.745 1.93-1.885c0-1.117-.744-1.861-1.93-1.861H5.863v-.117l9.097-8.84c5.537-5.375 7.165-8.167 7.165-11.75c0-5.327-4.722-9.399-11.027-9.399c-4.956 0-9.19 2.676-10.61 6.77C.21 18.68.1 19.33.1 19.912c0 1.163.691 1.93 1.831 1.93c1.094 0 1.559-.511 1.908-1.674c.186-.722.442-1.373.814-1.978c1.233-2.07 3.537-3.397 6.445-3.397c3.769 0 6.77 2.653 6.77 5.956c0 2.676-1.093 4.49-5.7 9.027L1.28 40.595C.303 41.572 0 42.154 0 43.015c0 1.21.791 1.954 2.024 1.954m27.989-.047h9.538C49.974 44.922 56 38.71 56 28.217s-6.026-16.565-16.449-16.565h-9.539c-1.28 0-2.093.838-2.093 2.14v28.966c0 1.326.814 2.164 2.093 2.164m2.117-3.815V15.42h7.119c8.003 0 12.447 4.654 12.447 12.82c0 8.212-4.444 12.865-12.447 12.865Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M2.024 44.969h19.334c1.186 0 1.93-.745 1.93-1.885c0-1.117-.744-1.861-1.93-1.861H5.863v-.117l9.097-8.84c5.537-5.375 7.165-8.167 7.165-11.75c0-5.327-4.722-9.399-11.027-9.399c-4.956 0-9.19 2.676-10.61 6.77C.21 18.68.1 19.33.1 19.912c0 1.163.691 1.93 1.831 1.93c1.094 0 1.559-.511 1.908-1.674c.186-.722.442-1.373.814-1.978c1.233-2.07 3.537-3.397 6.445-3.397c3.769 0 6.77 2.653 6.77 5.956c0 2.676-1.093 4.49-5.7 9.027L1.28 40.595C.303 41.572 0 42.154 0 43.015c0 1.21.791 1.954 2.024 1.954m27.989-.047h9.538C49.974 44.922 56 38.71 56 28.217s-6.026-16.565-16.449-16.565h-9.539c-1.28 0-2.093.838-2.093 2.14v28.966c0 1.326.814 2.164 2.093 2.164m2.117-3.815V15.42h7.119c8.003 0 12.447 4.654 12.447 12.82c0 8.212-4.444 12.865-12.447 12.865Z"/></svg> </template>
CSS
.icon-view-2d {
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%22M2.024%2044.969h19.334c1.186%200%201.93-.745%201.93-1.885c0-1.117-.744-1.861-1.93-1.861H5.863v-.117l9.097-8.84c5.537-5.375%207.165-8.167%207.165-11.75c0-5.327-4.722-9.399-11.027-9.399c-4.956%200-9.19%202.676-10.61%206.77C.21%2018.68.1%2019.33.1%2019.912c0%201.163.691%201.93%201.831%201.93c1.094%200%201.559-.511%201.908-1.674c.186-.722.442-1.373.814-1.978c1.233-2.07%203.537-3.397%206.445-3.397c3.769%200%206.77%202.653%206.77%205.956c0%202.676-1.093%204.49-5.7%209.027L1.28%2040.595C.303%2041.572%200%2042.154%200%2043.015c0%201.21.791%201.954%202.024%201.954m27.989-.047h9.538C49.974%2044.922%2056%2038.71%2056%2028.217s-6.026-16.565-16.449-16.565h-9.539c-1.28%200-2.093.838-2.093%202.14v28.966c0%201.326.814%202.164%202.093%202.164m2.117-3.815V15.42h7.119c8.003%200%2012.447%204.654%2012.447%2012.82c0%208.212-4.444%2012.865-12.447%2012.865Z%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%22M2.024%2044.969h19.334c1.186%200%201.93-.745%201.93-1.885c0-1.117-.744-1.861-1.93-1.861H5.863v-.117l9.097-8.84c5.537-5.375%207.165-8.167%207.165-11.75c0-5.327-4.722-9.399-11.027-9.399c-4.956%200-9.19%202.676-10.61%206.77C.21%2018.68.1%2019.33.1%2019.912c0%201.163.691%201.93%201.831%201.93c1.094%200%201.559-.511%201.908-1.674c.186-.722.442-1.373.814-1.978c1.233-2.07%203.537-3.397%206.445-3.397c3.769%200%206.77%202.653%206.77%205.956c0%202.676-1.093%204.49-5.7%209.027L1.28%2040.595C.303%2041.572%200%2042.154%200%2043.015c0%201.21.791%201.954%202.024%201.954m27.989-.047h9.538C49.974%2044.922%2056%2038.71%2056%2028.217s-6.026-16.565-16.449-16.565h-9.539c-1.28%200-2.093.838-2.093%202.14v28.966c0%201.326.814%202.164%202.093%202.164m2.117-3.815V15.42h7.119c8.003%200%2012.447%204.654%2012.447%2012.82c0%208.212-4.444%2012.865-12.447%2012.865Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/f7/view-2d.svg?color=%231a73e8&size=48
