three d view icon
three-d-view from Huge Icons by Hugeicons · Stroke · MIT Free for personal and commercial use.
- Name
- three-d-view
- Set
- Huge Icons
- Style
- Stroke
- Viewbox
- 24×24
- License
- MIT
Related icons in Huge Icons
Use the three d view icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"><path d="M12 11.5c.495 0 .956-.198 1.877-.595l.665-.287C16.181 9.912 17 9.559 17 9s-.82-.912-2.458-1.618l-.665-.287C12.958 6.7 12.496 6.5 12 6.5s-.956.199-1.877.595l-.665.287C7.819 8.088 7 8.441 7 9s.82.912 2.458 1.618l.665.287c.92.397 1.382.595 1.877.595m0 0v6"/><path d="M17 9v6c0 .559-.82.912-2.458 1.618l-.665.287c-.92.396-1.382.595-1.877.595s-.956-.198-1.877-.596l-.665-.286C7.819 15.912 7 15.559 7 15V9m2.144-6.5c-2.657.06-4.209.315-5.27 1.375S2.562 6.487 2.5 9.145M14.856 2.5c2.657.06 4.209.315 5.27 1.375s1.313 2.612 1.374 5.27M14.856 21.5c2.657-.06 4.209-.315 5.27-1.375s1.313-2.612 1.374-5.27M9.144 21.5c-2.657-.06-4.209-.315-5.27-1.375s-1.313-2.612-1.374-5.27"/></g></svg>
React
import type { SVGProps } from "react";
export function HugeiconsThreeDView(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5"><path d="M12 11.5c.495 0 .956-.198 1.877-.595l.665-.287C16.181 9.912 17 9.559 17 9s-.82-.912-2.458-1.618l-.665-.287C12.958 6.7 12.496 6.5 12 6.5s-.956.199-1.877.595l-.665.287C7.819 8.088 7 8.441 7 9s.82.912 2.458 1.618l.665.287c.92.397 1.382.595 1.877.595m0 0v6"/><path d="M17 9v6c0 .559-.82.912-2.458 1.618l-.665.287c-.92.396-1.382.595-1.877.595s-.956-.198-1.877-.596l-.665-.286C7.819 15.912 7 15.559 7 15V9m2.144-6.5c-2.657.06-4.209.315-5.27 1.375S2.562 6.487 2.5 9.145M14.856 2.5c2.657.06 4.209.315 5.27 1.375s1.313 2.612 1.374 5.27M14.856 21.5c2.657-.06 4.209-.315 5.27-1.375s1.313-2.612 1.374-5.27M9.144 21.5c-2.657-.06-4.209-.315-5.27-1.375s-1.313-2.612-1.374-5.27"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"><path d="M12 11.5c.495 0 .956-.198 1.877-.595l.665-.287C16.181 9.912 17 9.559 17 9s-.82-.912-2.458-1.618l-.665-.287C12.958 6.7 12.496 6.5 12 6.5s-.956.199-1.877.595l-.665.287C7.819 8.088 7 8.441 7 9s.82.912 2.458 1.618l.665.287c.92.397 1.382.595 1.877.595m0 0v6"/><path d="M17 9v6c0 .559-.82.912-2.458 1.618l-.665.287c-.92.396-1.382.595-1.877.595s-.956-.198-1.877-.596l-.665-.286C7.819 15.912 7 15.559 7 15V9m2.144-6.5c-2.657.06-4.209.315-5.27 1.375S2.562 6.487 2.5 9.145M14.856 2.5c2.657.06 4.209.315 5.27 1.375s1.313 2.612 1.374 5.27M14.856 21.5c2.657-.06 4.209-.315 5.27-1.375s1.313-2.612 1.374-5.27M9.144 21.5c-2.657-.06-4.209-.315-5.27-1.375s-1.313-2.612-1.374-5.27"/></g></svg> </template>
CSS
.icon-three-d-view {
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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M12%2011.5c.495%200%20.956-.198%201.877-.595l.665-.287C16.181%209.912%2017%209.559%2017%209s-.82-.912-2.458-1.618l-.665-.287C12.958%206.7%2012.496%206.5%2012%206.5s-.956.199-1.877.595l-.665.287C7.819%208.088%207%208.441%207%209s.82.912%202.458%201.618l.665.287c.92.397%201.382.595%201.877.595m0%200v6%22%2F%3E%3Cpath%20d%3D%22M17%209v6c0%20.559-.82.912-2.458%201.618l-.665.287c-.92.396-1.382.595-1.877.595s-.956-.198-1.877-.596l-.665-.286C7.819%2015.912%207%2015.559%207%2015V9m2.144-6.5c-2.657.06-4.209.315-5.27%201.375S2.562%206.487%202.5%209.145M14.856%202.5c2.657.06%204.209.315%205.27%201.375s1.313%202.612%201.374%205.27M14.856%2021.5c2.657-.06%204.209-.315%205.27-1.375s1.313-2.612%201.374-5.27M9.144%2021.5c-2.657-.06-4.209-.315-5.27-1.375s-1.313-2.612-1.374-5.27%22%2F%3E%3C%2Fg%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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M12%2011.5c.495%200%20.956-.198%201.877-.595l.665-.287C16.181%209.912%2017%209.559%2017%209s-.82-.912-2.458-1.618l-.665-.287C12.958%206.7%2012.496%206.5%2012%206.5s-.956.199-1.877.595l-.665.287C7.819%208.088%207%208.441%207%209s.82.912%202.458%201.618l.665.287c.92.397%201.382.595%201.877.595m0%200v6%22%2F%3E%3Cpath%20d%3D%22M17%209v6c0%20.559-.82.912-2.458%201.618l-.665.287c-.92.396-1.382.595-1.877.595s-.956-.198-1.877-.596l-.665-.286C7.819%2015.912%207%2015.559%207%2015V9m2.144-6.5c-2.657.06-4.209.315-5.27%201.375S2.562%206.487%202.5%209.145M14.856%202.5c2.657.06%204.209.315%205.27%201.375s1.313%202.612%201.374%205.27M14.856%2021.5c2.657-.06%204.209-.315%205.27-1.375s1.313-2.612%201.374-5.27M9.144%2021.5c-2.657-.06-4.209-.315-5.27-1.375s-1.313-2.612-1.374-5.27%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/hugeicons/three-d-view.svg?color=%231a73e8&size=48
