circle stack icon
circle-stack-16-solid from HeroIcons by Refactoring UI Inc · Solid 16x16 · MIT Free for personal and commercial use.
- Name
- circle-stack-16-solid
- Set
- HeroIcons
- Style
- Solid 16x16
- Viewbox
- 16×16
- License
- MIT
3 other variants in HeroIcons
Use the circle stack icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M8 7c3.314 0 6-1.343 6-3s-2.686-3-6-3s-6 1.343-6 3s2.686 3 6 3"/><path fill="currentColor" d="M8 8.5c1.84 0 3.579-.37 4.914-1.037A6.3 6.3 0 0 0 14 6.78V8c0 1.657-2.686 3-6 3S2 9.657 2 8V6.78c.346.273.72.5 1.087.683C4.42 8.131 6.16 8.5 8 8.5"/><path fill="currentColor" d="M8 12.5c1.84 0 3.579-.37 4.914-1.037c.366-.183.74-.41 1.086-.684V12c0 1.657-2.686 3-6 3s-6-1.343-6-3v-1.22c.346.273.72.5 1.087.683C4.42 12.131 6.16 12.5 8 12.5"/></svg>
React
import type { SVGProps } from "react";
export function HeroiconsCircleStack16Solid(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M8 7c3.314 0 6-1.343 6-3s-2.686-3-6-3s-6 1.343-6 3s2.686 3 6 3"/><path fill="currentColor" d="M8 8.5c1.84 0 3.579-.37 4.914-1.037A6.3 6.3 0 0 0 14 6.78V8c0 1.657-2.686 3-6 3S2 9.657 2 8V6.78c.346.273.72.5 1.087.683C4.42 8.131 6.16 8.5 8 8.5"/><path fill="currentColor" d="M8 12.5c1.84 0 3.579-.37 4.914-1.037c.366-.183.74-.41 1.086-.684V12c0 1.657-2.686 3-6 3s-6-1.343-6-3v-1.22c.346.273.72.5 1.087.683C4.42 12.131 6.16 12.5 8 12.5"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M8 7c3.314 0 6-1.343 6-3s-2.686-3-6-3s-6 1.343-6 3s2.686 3 6 3"/><path fill="currentColor" d="M8 8.5c1.84 0 3.579-.37 4.914-1.037A6.3 6.3 0 0 0 14 6.78V8c0 1.657-2.686 3-6 3S2 9.657 2 8V6.78c.346.273.72.5 1.087.683C4.42 8.131 6.16 8.5 8 8.5"/><path fill="currentColor" d="M8 12.5c1.84 0 3.579-.37 4.914-1.037c.366-.183.74-.41 1.086-.684V12c0 1.657-2.686 3-6 3s-6-1.343-6-3v-1.22c.346.273.72.5 1.087.683C4.42 12.131 6.16 12.5 8 12.5"/></svg> </template>
CSS
.icon-circle-stack-16-solid {
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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8%207c3.314%200%206-1.343%206-3s-2.686-3-6-3s-6%201.343-6%203s2.686%203%206%203%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8%208.5c1.84%200%203.579-.37%204.914-1.037A6.3%206.3%200%200%200%2014%206.78V8c0%201.657-2.686%203-6%203S2%209.657%202%208V6.78c.346.273.72.5%201.087.683C4.42%208.131%206.16%208.5%208%208.5%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8%2012.5c1.84%200%203.579-.37%204.914-1.037c.366-.183.74-.41%201.086-.684V12c0%201.657-2.686%203-6%203s-6-1.343-6-3v-1.22c.346.273.72.5%201.087.683C4.42%2012.131%206.16%2012.5%208%2012.5%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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8%207c3.314%200%206-1.343%206-3s-2.686-3-6-3s-6%201.343-6%203s2.686%203%206%203%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8%208.5c1.84%200%203.579-.37%204.914-1.037A6.3%206.3%200%200%200%2014%206.78V8c0%201.657-2.686%203-6%203S2%209.657%202%208V6.78c.346.273.72.5%201.087.683C4.42%208.131%206.16%208.5%208%208.5%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8%2012.5c1.84%200%203.579-.37%204.914-1.037c.366-.183.74-.41%201.086-.684V12c0%201.657-2.686%203-6%203s-6-1.343-6-3v-1.22c.346.273.72.5%201.087.683C4.42%2012.131%206.16%2012.5%208%2012.5%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/heroicons/circle-stack-16-solid.svg?color=%231a73e8&size=48
