at circle icon
at-circle-fill from Framework7 Icons by Vladimir Kharlampidi · Fill · MIT Free for personal and commercial use.
- Name
- at-circle-fill
- Set
- Framework7 Icons
- Style
- Fill
- Viewbox
- 56×56
- License
- MIT
1 other variant in Framework7 Icons
The same icon in other sets
Related icons in Framework7 Icons
Use the at circle icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" fill-rule="evenodd" d="M28 4c13.255 0 24 10.745 24 24S41.255 52 28 52S4 41.255 4 28S14.745 4 28 4m.39 11.143c-7.808 0-13.247 5.344-13.247 13.264c0 8.429 5.646 13.264 13.502 13.264c1.94 0 3.738-.255 5.09-.7v-2.195c-.986.414-3.006.684-4.978.684c-6.457 0-11.133-3.944-11.133-10.958c0-6.552 4.421-11.164 10.592-11.164c6.218 0 10.465 3.832 10.465 9.622c0 3.848-1.288 6.043-3.054 6.043c-1.145 0-1.701-.716-1.701-1.765v-9.034h-2.688v1.925h-.175c-.605-1.368-2.115-2.243-3.817-2.243c-3.229 0-5.471 2.672-5.471 6.537c0 4.04 2.226 6.743 5.534 6.743c1.861 0 3.293-.89 3.96-2.497h.16c.254 1.575 1.797 2.608 3.657 2.608c3.786 0 6.076-3.324 6.076-8.397c0-7.03-5.328-11.737-12.771-11.737m-.556 9.176c2.004 0 3.276 1.623 3.276 4.183s-1.288 4.183-3.292 4.183c-1.94 0-3.117-1.59-3.117-4.183c0-2.624 1.177-4.183 3.133-4.183"/></svg>
React
import type { SVGProps } from "react";
export function F7AtCircleFill(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" fillRule="evenodd" d="M28 4c13.255 0 24 10.745 24 24S41.255 52 28 52S4 41.255 4 28S14.745 4 28 4m.39 11.143c-7.808 0-13.247 5.344-13.247 13.264c0 8.429 5.646 13.264 13.502 13.264c1.94 0 3.738-.255 5.09-.7v-2.195c-.986.414-3.006.684-4.978.684c-6.457 0-11.133-3.944-11.133-10.958c0-6.552 4.421-11.164 10.592-11.164c6.218 0 10.465 3.832 10.465 9.622c0 3.848-1.288 6.043-3.054 6.043c-1.145 0-1.701-.716-1.701-1.765v-9.034h-2.688v1.925h-.175c-.605-1.368-2.115-2.243-3.817-2.243c-3.229 0-5.471 2.672-5.471 6.537c0 4.04 2.226 6.743 5.534 6.743c1.861 0 3.293-.89 3.96-2.497h.16c.254 1.575 1.797 2.608 3.657 2.608c3.786 0 6.076-3.324 6.076-8.397c0-7.03-5.328-11.737-12.771-11.737m-.556 9.176c2.004 0 3.276 1.623 3.276 4.183s-1.288 4.183-3.292 4.183c-1.94 0-3.117-1.59-3.117-4.183c0-2.624 1.177-4.183 3.133-4.183"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" fill-rule="evenodd" d="M28 4c13.255 0 24 10.745 24 24S41.255 52 28 52S4 41.255 4 28S14.745 4 28 4m.39 11.143c-7.808 0-13.247 5.344-13.247 13.264c0 8.429 5.646 13.264 13.502 13.264c1.94 0 3.738-.255 5.09-.7v-2.195c-.986.414-3.006.684-4.978.684c-6.457 0-11.133-3.944-11.133-10.958c0-6.552 4.421-11.164 10.592-11.164c6.218 0 10.465 3.832 10.465 9.622c0 3.848-1.288 6.043-3.054 6.043c-1.145 0-1.701-.716-1.701-1.765v-9.034h-2.688v1.925h-.175c-.605-1.368-2.115-2.243-3.817-2.243c-3.229 0-5.471 2.672-5.471 6.537c0 4.04 2.226 6.743 5.534 6.743c1.861 0 3.293-.89 3.96-2.497h.16c.254 1.575 1.797 2.608 3.657 2.608c3.786 0 6.076-3.324 6.076-8.397c0-7.03-5.328-11.737-12.771-11.737m-.556 9.176c2.004 0 3.276 1.623 3.276 4.183s-1.288 4.183-3.292 4.183c-1.94 0-3.117-1.59-3.117-4.183c0-2.624 1.177-4.183 3.133-4.183"/></svg> </template>
CSS
.icon-at-circle-fill {
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%20fill-rule%3D%22evenodd%22%20d%3D%22M28%204c13.255%200%2024%2010.745%2024%2024S41.255%2052%2028%2052S4%2041.255%204%2028S14.745%204%2028%204m.39%2011.143c-7.808%200-13.247%205.344-13.247%2013.264c0%208.429%205.646%2013.264%2013.502%2013.264c1.94%200%203.738-.255%205.09-.7v-2.195c-.986.414-3.006.684-4.978.684c-6.457%200-11.133-3.944-11.133-10.958c0-6.552%204.421-11.164%2010.592-11.164c6.218%200%2010.465%203.832%2010.465%209.622c0%203.848-1.288%206.043-3.054%206.043c-1.145%200-1.701-.716-1.701-1.765v-9.034h-2.688v1.925h-.175c-.605-1.368-2.115-2.243-3.817-2.243c-3.229%200-5.471%202.672-5.471%206.537c0%204.04%202.226%206.743%205.534%206.743c1.861%200%203.293-.89%203.96-2.497h.16c.254%201.575%201.797%202.608%203.657%202.608c3.786%200%206.076-3.324%206.076-8.397c0-7.03-5.328-11.737-12.771-11.737m-.556%209.176c2.004%200%203.276%201.623%203.276%204.183s-1.288%204.183-3.292%204.183c-1.94%200-3.117-1.59-3.117-4.183c0-2.624%201.177-4.183%203.133-4.183%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%20fill-rule%3D%22evenodd%22%20d%3D%22M28%204c13.255%200%2024%2010.745%2024%2024S41.255%2052%2028%2052S4%2041.255%204%2028S14.745%204%2028%204m.39%2011.143c-7.808%200-13.247%205.344-13.247%2013.264c0%208.429%205.646%2013.264%2013.502%2013.264c1.94%200%203.738-.255%205.09-.7v-2.195c-.986.414-3.006.684-4.978.684c-6.457%200-11.133-3.944-11.133-10.958c0-6.552%204.421-11.164%2010.592-11.164c6.218%200%2010.465%203.832%2010.465%209.622c0%203.848-1.288%206.043-3.054%206.043c-1.145%200-1.701-.716-1.701-1.765v-9.034h-2.688v1.925h-.175c-.605-1.368-2.115-2.243-3.817-2.243c-3.229%200-5.471%202.672-5.471%206.537c0%204.04%202.226%206.743%205.534%206.743c1.861%200%203.293-.89%203.96-2.497h.16c.254%201.575%201.797%202.608%203.657%202.608c3.786%200%206.076-3.324%206.076-8.397c0-7.03-5.328-11.737-12.771-11.737m-.556%209.176c2.004%200%203.276%201.623%203.276%204.183s-1.288%204.183-3.292%204.183c-1.94%200-3.117-1.59-3.117-4.183c0-2.624%201.177-4.183%203.133-4.183%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/f7/at-circle-fill.svg?color=%231a73e8&size=48