circle layer icon
circle-layer from Unicons by Iconscout · Line · Design Tools · Apache-2.0 Free for personal and commercial use.
- Name
- circle-layer
- Set
- Unicons
- Style
- Line
- Category
- Design Tools
- Viewbox
- 24×24
- License
- Apache 2.0
The same icon in other sets
More design tools icons from Unicons
appsborder-outbring-bottombring-frontbrush-altcompresscompress-linescompress-vcrop-altcrop-alt-rotate-leftcrop-alt-rotate-rightexcludeflip-hflip-h-altflip-vflip-v-altgridshorizontal-align-centerhorizontal-align-lefthorizontal-align-righthorizontal-distribution-centerhorizontal-distribution-lefthorizontal-distribution-righticons
Use the circle layer icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M15 2a7 7 0 0 0-6.88 5.74A6 6 0 0 0 5 12.41A5 5 0 1 0 11.59 19a6 6 0 0 0 4.67-3.09A7 7 0 0 0 15 2m-5 15.43c0 .1 0 .2-.07.31a3 3 0 1 1-3.64-3.64l.28-.1A2.94 2.94 0 0 1 10 17.43m5-3.67a2 2 0 0 1-.05.19a4 4 0 0 1-.17.54a4 4 0 0 1-2.7 2.4c0-.18 0-.35-.06-.53s0-.27 0-.4s-.12-.38-.18-.57s-.07-.24-.12-.36a4 4 0 0 0-.3-.55c0-.09-.09-.19-.15-.28a5.3 5.3 0 0 0-.6-.73l-.2-.17a6 6 0 0 0-.53-.43a3 3 0 0 0-.34-.19a4 4 0 0 0-.5-.27a2.3 2.3 0 0 0-.4-.13a3 3 0 0 0-.52-.16c-.14 0-.29 0-.44-.06L7.13 12a4 4 0 0 1 2.39-2.7a3.3 3.3 0 0 1 .53-.17l.2-.05A3.7 3.7 0 0 1 11 9a4 4 0 0 1 4 4a4 4 0 0 1-.08.76Zm2-.16V13a6 6 0 0 0-6-6h-.6a5 5 0 1 1 6.6 6.6"/></svg>
React
import type { SVGProps } from "react";
export function UilCircleLayer(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="M15 2a7 7 0 0 0-6.88 5.74A6 6 0 0 0 5 12.41A5 5 0 1 0 11.59 19a6 6 0 0 0 4.67-3.09A7 7 0 0 0 15 2m-5 15.43c0 .1 0 .2-.07.31a3 3 0 1 1-3.64-3.64l.28-.1A2.94 2.94 0 0 1 10 17.43m5-3.67a2 2 0 0 1-.05.19a4 4 0 0 1-.17.54a4 4 0 0 1-2.7 2.4c0-.18 0-.35-.06-.53s0-.27 0-.4s-.12-.38-.18-.57s-.07-.24-.12-.36a4 4 0 0 0-.3-.55c0-.09-.09-.19-.15-.28a5.3 5.3 0 0 0-.6-.73l-.2-.17a6 6 0 0 0-.53-.43a3 3 0 0 0-.34-.19a4 4 0 0 0-.5-.27a2.3 2.3 0 0 0-.4-.13a3 3 0 0 0-.52-.16c-.14 0-.29 0-.44-.06L7.13 12a4 4 0 0 1 2.39-2.7a3.3 3.3 0 0 1 .53-.17l.2-.05A3.7 3.7 0 0 1 11 9a4 4 0 0 1 4 4a4 4 0 0 1-.08.76Zm2-.16V13a6 6 0 0 0-6-6h-.6a5 5 0 1 1 6.6 6.6"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M15 2a7 7 0 0 0-6.88 5.74A6 6 0 0 0 5 12.41A5 5 0 1 0 11.59 19a6 6 0 0 0 4.67-3.09A7 7 0 0 0 15 2m-5 15.43c0 .1 0 .2-.07.31a3 3 0 1 1-3.64-3.64l.28-.1A2.94 2.94 0 0 1 10 17.43m5-3.67a2 2 0 0 1-.05.19a4 4 0 0 1-.17.54a4 4 0 0 1-2.7 2.4c0-.18 0-.35-.06-.53s0-.27 0-.4s-.12-.38-.18-.57s-.07-.24-.12-.36a4 4 0 0 0-.3-.55c0-.09-.09-.19-.15-.28a5.3 5.3 0 0 0-.6-.73l-.2-.17a6 6 0 0 0-.53-.43a3 3 0 0 0-.34-.19a4 4 0 0 0-.5-.27a2.3 2.3 0 0 0-.4-.13a3 3 0 0 0-.52-.16c-.14 0-.29 0-.44-.06L7.13 12a4 4 0 0 1 2.39-2.7a3.3 3.3 0 0 1 .53-.17l.2-.05A3.7 3.7 0 0 1 11 9a4 4 0 0 1 4 4a4 4 0 0 1-.08.76Zm2-.16V13a6 6 0 0 0-6-6h-.6a5 5 0 1 1 6.6 6.6"/></svg> </template>
CSS
.icon-circle-layer {
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%22M15%202a7%207%200%200%200-6.88%205.74A6%206%200%200%200%205%2012.41A5%205%200%201%200%2011.59%2019a6%206%200%200%200%204.67-3.09A7%207%200%200%200%2015%202m-5%2015.43c0%20.1%200%20.2-.07.31a3%203%200%201%201-3.64-3.64l.28-.1A2.94%202.94%200%200%201%2010%2017.43m5-3.67a2%202%200%200%201-.05.19a4%204%200%200%201-.17.54a4%204%200%200%201-2.7%202.4c0-.18%200-.35-.06-.53s0-.27%200-.4s-.12-.38-.18-.57s-.07-.24-.12-.36a4%204%200%200%200-.3-.55c0-.09-.09-.19-.15-.28a5.3%205.3%200%200%200-.6-.73l-.2-.17a6%206%200%200%200-.53-.43a3%203%200%200%200-.34-.19a4%204%200%200%200-.5-.27a2.3%202.3%200%200%200-.4-.13a3%203%200%200%200-.52-.16c-.14%200-.29%200-.44-.06L7.13%2012a4%204%200%200%201%202.39-2.7a3.3%203.3%200%200%201%20.53-.17l.2-.05A3.7%203.7%200%200%201%2011%209a4%204%200%200%201%204%204a4%204%200%200%201-.08.76Zm2-.16V13a6%206%200%200%200-6-6h-.6a5%205%200%201%201%206.6%206.6%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%22M15%202a7%207%200%200%200-6.88%205.74A6%206%200%200%200%205%2012.41A5%205%200%201%200%2011.59%2019a6%206%200%200%200%204.67-3.09A7%207%200%200%200%2015%202m-5%2015.43c0%20.1%200%20.2-.07.31a3%203%200%201%201-3.64-3.64l.28-.1A2.94%202.94%200%200%201%2010%2017.43m5-3.67a2%202%200%200%201-.05.19a4%204%200%200%201-.17.54a4%204%200%200%201-2.7%202.4c0-.18%200-.35-.06-.53s0-.27%200-.4s-.12-.38-.18-.57s-.07-.24-.12-.36a4%204%200%200%200-.3-.55c0-.09-.09-.19-.15-.28a5.3%205.3%200%200%200-.6-.73l-.2-.17a6%206%200%200%200-.53-.43a3%203%200%200%200-.34-.19a4%204%200%200%200-.5-.27a2.3%202.3%200%200%200-.4-.13a3%203%200%200%200-.52-.16c-.14%200-.29%200-.44-.06L7.13%2012a4%204%200%200%201%202.39-2.7a3.3%203.3%200%200%201%20.53-.17l.2-.05A3.7%203.7%200%200%201%2011%209a4%204%200%200%201%204%204a4%204%200%200%201-.08.76Zm2-.16V13a6%206%200%200%200-6-6h-.6a5%205%200%201%201%206.6%206.6%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/uil/circle-layer.svg?color=%231a73e8&size=48
