Person Edit icon
Used in a wide range of scenarios - representing a general person, a contact, contact lists, sharing, and managing access. The Person Edit icon is part of Microsoft's Fluent UI System Icons, available here in regular, filled and color styles in 5 sizes from 16 to 48 px. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Every size and style
Microsoft draws each size separately so icons stay crisp, rather than scaling one drawing. Pick a style and size to preview it, download it, or copy the code for your platform.
Regular, 24 px
ic_fluent_person_edit_24_regular.svg
Person Edit icon in React
npm install @fluentui/react-icons
import { PersonEdit24Regular } from "@fluentui/react-icons";
export function Example() {
return <PersonEdit24Regular aria-label="Person Edit" />;
}Use the Person Edit 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 { PersonEdit24Regular, PersonEdit24Filled } from "@fluentui/react-icons";
export function Example() {
return <PersonEdit24Regular aria-label="Person Edit" />;
}Coding agents can look up this component through the Fluent Icons MCP server.
Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_person_edit_24_regular.svg" width="24" height="24" alt="Person Edit"> 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="M14.8555 15.5002L16.3555 14.0002H6.25278C5.01076 14.0002 4.00391 15.007 4.00391 16.2491V16.8267C4.00391 17.7195 4.32242 18.583 4.90219 19.2619C6.29795 20.8964 8.34464 21.7932 10.9999 21.9691C10.9958 21.7863 11.016 21.5982 11.0636 21.4078L11.2946 20.484C8.92119 20.3643 7.18576 19.6262 6.04287 18.2878C5.69502 17.8805 5.50391 17.3624 5.50391 16.8267V16.2491C5.50391 15.8355 5.83919 15.5002 6.25278 15.5002H14.8555ZM12.0004 2.00488C14.7618 2.00488 17.0004 4.24346 17.0004 7.00488C17.0004 9.76631 14.7618 12.0049 12.0004 12.0049C9.23894 12.0049 7.00036 9.76631 7.00036 7.00488C7.00036 4.24346 9.23894 2.00488 12.0004 2.00488ZM12.0004 3.50488C10.0674 3.50488 8.50036 5.07189 8.50036 7.00488C8.50036 8.93788 10.0674 10.5049 12.0004 10.5049C13.9334 10.5049 15.5004 8.93788 15.5004 7.00488C15.5004 5.07189 13.9334 3.50488 12.0004 3.50488ZM19.0999 12.6695L13.1974 18.5719C12.8533 18.916 12.6092 19.3472 12.4911 19.8194L12.0334 21.6501C11.8344 22.4462 12.5556 23.1674 13.3517 22.9683L15.1824 22.5106C15.6545 22.3926 16.0857 22.1485 16.4299 21.8043L22.3323 15.9019C23.2249 15.0093 23.2249 13.5621 22.3323 12.6695C21.4397 11.7768 19.9925 11.7768 19.0999 12.6695Z" fill="currentColor"/></svg>Details
| Name | Person Edit |
|---|---|
| Styles | Regular (outlined), Filled, Color |
| Sizes | 16 px, 20 px, 24 px, 32 px, 48 px |
| Regular (outlined) file | ic_fluent_person_edit_24_regular.svg |
| Filled file | ic_fluent_person_edit_24_filled.svg |
| Color file | ic_fluent_person_edit_32_color.svg |
| React (Regular) | PersonEdit16Regular, PersonEdit20Regular, PersonEdit24Regular, PersonEdit32Regular, PersonEdit48Regular |
| React (Filled) | PersonEdit16Filled, PersonEdit20Filled, PersonEdit24Filled, PersonEdit32Filled, PersonEdit48Filled |
| React (Color) | PersonEdit32Color |
| License | MIT (© Microsoft Corporation) |