Person Alert Off icon
Used in a wide range of scenarios - representing a general person, a contact, contact lists, sharing, and managing access. The Person Alert Off icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Person Alert Off icon in React
Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.
npm install @fluentui/react-icons
import { PersonAlertOff24Regular, PersonAlertOff24Filled } from "@fluentui/react-icons";
export function Example() {
return <PersonAlertOff24Regular aria-label="Person Alert Off" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_person_alert_off_24_regular.svg" width="24" height="24" alt="Person Alert Off"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19.002 22C18.7836 22.5825 18.1943 22.9999 17.502 23C16.8096 22.9998 16.2203 22.5824 16.002 22H19.002ZM12.7197 12.7197C13.0126 12.427 13.4874 12.4269 13.7803 12.7197L22.2803 21.2197C22.573 21.5126 22.573 21.9874 22.2803 22.2803C21.9874 22.5731 21.5126 22.5731 21.2197 22.2803L19.9395 21H12.9922C12.5899 21 12.3882 20.9995 12.2871 20.9521C12.039 20.8353 11.9314 20.5403 12.0459 20.291C12.0927 20.1897 12.2466 20.0599 12.5537 19.8008L13.502 19V16C13.502 15.5669 13.5716 15.1502 13.6992 14.7598L12.7197 13.7803C12.4268 13.4874 12.4268 13.0126 12.7197 12.7197ZM11.6709 14C11.7545 14.1759 11.8671 14.3417 12.0127 14.4873L12.5898 15.0645C12.5778 15.1278 12.5682 15.1917 12.5586 15.2559C12.5533 15.2906 12.5485 15.3254 12.5439 15.3604C12.538 15.4068 12.53 15.4532 12.5254 15.5H4.25293C3.83934 15.5 3.50391 15.8354 3.50391 16.249V16.8262C3.50391 17.3617 3.69524 17.8798 4.04297 18.2871C5.29622 19.7547 7.26189 20.5009 10 20.501C10.3447 20.501 10.6776 20.4894 10.998 20.4658C10.9852 21.0413 11.3066 21.5971 11.8604 21.8574C11.8755 21.8645 11.8911 21.8716 11.9062 21.8779C11.3058 21.9602 10.6697 22.001 10 22.001C6.85438 22.0009 4.46859 21.0958 2.90234 19.2617C2.32258 18.5828 2.00391 17.719 2.00391 16.8262V16.249C2.00391 15.007 3.01091 14 4.25293 14H11.6709ZM17.502 12C19.711 12.0001 21.502 13.7909 21.502 16V18H21.5V19.0254L15.2021 12.7275C15.8527 12.2695 16.6459 12.0001 17.502 12ZM10 2.00488C12.7614 2.00488 15 4.24346 15 7.00488C14.9999 9.76619 12.7613 12.0049 10 12.0049C7.23883 12.0047 5.00013 9.76607 5 7.00488C5 4.24358 7.23874 2.00508 10 2.00488ZM10 3.50488C8.06717 3.50508 6.5 5.07201 6.5 7.00488C6.50013 8.93765 8.06725 10.5047 10 10.5049C11.9329 10.5049 13.4999 8.93777 13.5 7.00488C13.5 5.07189 11.933 3.50488 10 3.50488Z" fill="currentColor"/></svg>Use it from the SVG package
Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:
npm install @fluentui/svg-icons
import icon from "@fluentui/svg-icons/icons/person_alert_off_24_regular.svg";Details
| Name | Person Alert Off |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_person_alert_off_24_regular.svg |
| Filled file | ic_fluent_person_alert_off_24_filled.svg |
| React components | PersonAlertOff24Regular, PersonAlertOff24Filled |
| License | MIT (© Microsoft Corporation) |