person circle off icon
person-circle-off-28-filled from Fluent UI System Icons by Microsoft Corporation · 28 Filled · MIT Free for personal and commercial use.
- Name
- person-circle-off-28-filled
- Set
- Fluent UI System Icons
- Style
- 28 Filled
- Viewbox
- 28×28
- License
- MIT
11 other variants in Fluent UI System Icons
person-circle-off-12-filledperson-circle-off-12-regularperson-circle-off-16-filledperson-circle-off-16-regularperson-circle-off-20-filledperson-circle-off-20-regularperson-circle-off-24-filledperson-circle-off-24-regularperson-circle-off-28-regularperson-circle-off-32-filledperson-circle-off-32-regular
Related icons in Fluent UI System Icons
person-5-20-filledperson-6-20-filledperson-account-16-filledperson-accounts-20-filledperson-add-16-filledperson-alert-16-filledperson-alert-off-16-filledperson-arrow-back-16-filledperson-arrow-left-16-filledperson-arrow-right-16-filledperson-available-16-filledperson-board-12-filledperson-board-add-16-filledperson-briefcase-16-filledperson-call-16-filledperson-chat-16-filledperson-circle-12-filledperson-clock-16-filledperson-delete-16-filledperson-desktop-20-filledperson-edit-16-filledperson-error-16-filledperson-feedback-16-filledperson-guest-16-filled
Use the person circle off icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="currentColor" d="M2.22 2.22a.75.75 0 0 1 1.06 0l22.5 22.5a.75.75 0 0 1-1.06 1.06l-2.784-2.784A11.95 11.95 0 0 1 14 26C7.373 26 2 20.627 2 14c0-3.044 1.134-5.822 3.002-7.937L2.22 3.28a.75.75 0 0 1 0-1.06M10.143 14C8.959 14 8 14.96 8 16.143c0 3.214 2.686 5.357 6 5.357c1.855 0 3.51-.674 4.61-1.83L12.94 14zM14 2c6.627 0 12 5.373 12 12c0 2.501-.767 4.823-2.076 6.745l-3.962-3.962q.037-.312.038-.64C20 14.959 19.04 14 17.857 14h-.678l-1.805-1.805a3.25 3.25 0 1 0-4.32-4.32l-3.8-3.8A11.94 11.94 0 0 1 14 2"/></svg>
React
import type { SVGProps } from "react";
export function FluentPersonCircleOff28Filled(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="currentColor" d="M2.22 2.22a.75.75 0 0 1 1.06 0l22.5 22.5a.75.75 0 0 1-1.06 1.06l-2.784-2.784A11.95 11.95 0 0 1 14 26C7.373 26 2 20.627 2 14c0-3.044 1.134-5.822 3.002-7.937L2.22 3.28a.75.75 0 0 1 0-1.06M10.143 14C8.959 14 8 14.96 8 16.143c0 3.214 2.686 5.357 6 5.357c1.855 0 3.51-.674 4.61-1.83L12.94 14zM14 2c6.627 0 12 5.373 12 12c0 2.501-.767 4.823-2.076 6.745l-3.962-3.962q.037-.312.038-.64C20 14.959 19.04 14 17.857 14h-.678l-1.805-1.805a3.25 3.25 0 1 0-4.32-4.32l-3.8-3.8A11.94 11.94 0 0 1 14 2"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="currentColor" d="M2.22 2.22a.75.75 0 0 1 1.06 0l22.5 22.5a.75.75 0 0 1-1.06 1.06l-2.784-2.784A11.95 11.95 0 0 1 14 26C7.373 26 2 20.627 2 14c0-3.044 1.134-5.822 3.002-7.937L2.22 3.28a.75.75 0 0 1 0-1.06M10.143 14C8.959 14 8 14.96 8 16.143c0 3.214 2.686 5.357 6 5.357c1.855 0 3.51-.674 4.61-1.83L12.94 14zM14 2c6.627 0 12 5.373 12 12c0 2.501-.767 4.823-2.076 6.745l-3.962-3.962q.037-.312.038-.64C20 14.959 19.04 14 17.857 14h-.678l-1.805-1.805a3.25 3.25 0 1 0-4.32-4.32l-3.8-3.8A11.94 11.94 0 0 1 14 2"/></svg> </template>
CSS
.icon-person-circle-off-28-filled {
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%2028%2028%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M2.22%202.22a.75.75%200%200%201%201.06%200l22.5%2022.5a.75.75%200%200%201-1.06%201.06l-2.784-2.784A11.95%2011.95%200%200%201%2014%2026C7.373%2026%202%2020.627%202%2014c0-3.044%201.134-5.822%203.002-7.937L2.22%203.28a.75.75%200%200%201%200-1.06M10.143%2014C8.959%2014%208%2014.96%208%2016.143c0%203.214%202.686%205.357%206%205.357c1.855%200%203.51-.674%204.61-1.83L12.94%2014zM14%202c6.627%200%2012%205.373%2012%2012c0%202.501-.767%204.823-2.076%206.745l-3.962-3.962q.037-.312.038-.64C20%2014.959%2019.04%2014%2017.857%2014h-.678l-1.805-1.805a3.25%203.25%200%201%200-4.32-4.32l-3.8-3.8A11.94%2011.94%200%200%201%2014%202%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%2028%2028%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M2.22%202.22a.75.75%200%200%201%201.06%200l22.5%2022.5a.75.75%200%200%201-1.06%201.06l-2.784-2.784A11.95%2011.95%200%200%201%2014%2026C7.373%2026%202%2020.627%202%2014c0-3.044%201.134-5.822%203.002-7.937L2.22%203.28a.75.75%200%200%201%200-1.06M10.143%2014C8.959%2014%208%2014.96%208%2016.143c0%203.214%202.686%205.357%206%205.357c1.855%200%203.51-.674%204.61-1.83L12.94%2014zM14%202c6.627%200%2012%205.373%2012%2012c0%202.501-.767%204.823-2.076%206.745l-3.962-3.962q.037-.312.038-.64C20%2014.959%2019.04%2014%2017.857%2014h-.678l-1.805-1.805a3.25%203.25%200%201%200-4.32-4.32l-3.8-3.8A11.94%2011.94%200%200%201%2014%202%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/person-circle-off-28-filled.svg?color=%231a73e8&size=48
