person edit icon
person-edit-48-filled from Fluent UI System Icons by Microsoft Corporation · 48 Filled · MIT Free for personal and commercial use.
- Name
- person-edit-48-filled
- Set
- Fluent UI System Icons
- Style
- 48 Filled
- Viewbox
- 48×48
- License
- MIT
9 other variants in Fluent UI System Icons
The same icon in other sets
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-circle-off-12-filledperson-clock-16-filledperson-delete-16-filledperson-desktop-20-filledperson-error-16-filledperson-feedback-16-filledperson-guest-16-filled
Use the person edit icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="currentColor" d="M22 4c-5.523 0-10 4.477-10 10s4.477 10 10 10s10-4.477 10-10S27.523 4 22 4M10.25 28A4.25 4.25 0 0 0 6 32.249V33c0 3.755 1.942 6.567 4.92 8.38C13.85 43.163 17.785 44 21.998 44q.002-.493.132-1.003l.838-3.235a5 5 0 0 1 1.277-2.253L33.609 28zm34.584-2.832a3.98 3.98 0 0 0-5.652.022L25.671 38.913a3 3 0 0 0-.767 1.351l-.838 3.234c-.383 1.477.961 2.82 2.437 2.438l3.235-.839a3 3 0 0 0 1.351-.766L44.812 30.82a3.98 3.98 0 0 0 .022-5.651"/></svg>
React
import type { SVGProps } from "react";
export function FluentPersonEdit48Filled(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="currentColor" d="M22 4c-5.523 0-10 4.477-10 10s4.477 10 10 10s10-4.477 10-10S27.523 4 22 4M10.25 28A4.25 4.25 0 0 0 6 32.249V33c0 3.755 1.942 6.567 4.92 8.38C13.85 43.163 17.785 44 21.998 44q.002-.493.132-1.003l.838-3.235a5 5 0 0 1 1.277-2.253L33.609 28zm34.584-2.832a3.98 3.98 0 0 0-5.652.022L25.671 38.913a3 3 0 0 0-.767 1.351l-.838 3.234c-.383 1.477.961 2.82 2.437 2.438l3.235-.839a3 3 0 0 0 1.351-.766L44.812 30.82a3.98 3.98 0 0 0 .022-5.651"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="currentColor" d="M22 4c-5.523 0-10 4.477-10 10s4.477 10 10 10s10-4.477 10-10S27.523 4 22 4M10.25 28A4.25 4.25 0 0 0 6 32.249V33c0 3.755 1.942 6.567 4.92 8.38C13.85 43.163 17.785 44 21.998 44q.002-.493.132-1.003l.838-3.235a5 5 0 0 1 1.277-2.253L33.609 28zm34.584-2.832a3.98 3.98 0 0 0-5.652.022L25.671 38.913a3 3 0 0 0-.767 1.351l-.838 3.234c-.383 1.477.961 2.82 2.437 2.438l3.235-.839a3 3 0 0 0 1.351-.766L44.812 30.82a3.98 3.98 0 0 0 .022-5.651"/></svg> </template>
CSS
.icon-person-edit-48-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%2048%2048%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M22%204c-5.523%200-10%204.477-10%2010s4.477%2010%2010%2010s10-4.477%2010-10S27.523%204%2022%204M10.25%2028A4.25%204.25%200%200%200%206%2032.249V33c0%203.755%201.942%206.567%204.92%208.38C13.85%2043.163%2017.785%2044%2021.998%2044q.002-.493.132-1.003l.838-3.235a5%205%200%200%201%201.277-2.253L33.609%2028zm34.584-2.832a3.98%203.98%200%200%200-5.652.022L25.671%2038.913a3%203%200%200%200-.767%201.351l-.838%203.234c-.383%201.477.961%202.82%202.437%202.438l3.235-.839a3%203%200%200%200%201.351-.766L44.812%2030.82a3.98%203.98%200%200%200%20.022-5.651%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%2048%2048%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M22%204c-5.523%200-10%204.477-10%2010s4.477%2010%2010%2010s10-4.477%2010-10S27.523%204%2022%204M10.25%2028A4.25%204.25%200%200%200%206%2032.249V33c0%203.755%201.942%206.567%204.92%208.38C13.85%2043.163%2017.785%2044%2021.998%2044q.002-.493.132-1.003l.838-3.235a5%205%200%200%201%201.277-2.253L33.609%2028zm34.584-2.832a3.98%203.98%200%200%200-5.652.022L25.671%2038.913a3%203%200%200%200-.767%201.351l-.838%203.234c-.383%201.477.961%202.82%202.437%202.438l3.235-.839a3%203%200%200%200%201.351-.766L44.812%2030.82a3.98%203.98%200%200%200%20.022-5.651%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/person-edit-48-filled.svg?color=%231a73e8&size=48
