Person Arrow Left icon

Used to represent a person leaving a meeting. The Person Arrow Left icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles in 3 sizes from 16 to 24 px. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.

Regular (outlined)

SVG

Filled

SVG

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_arrow_left_24_regular.svg

Person Arrow Left icon in React

npm install @fluentui/react-icons

import { PersonArrowLeft24Regular } from "@fluentui/react-icons";

export function Example() {
  return <PersonArrowLeft24Regular aria-label="Person Arrow Left" />;
}

Person Arrow Left icon in SVG

npm install @fluentui/svg-icons

import icon from "@fluentui/svg-icons/icons/person_arrow_left_24_regular.svg";

<!-- or load it from a CDN -->
<img src="https://cdn.jsdelivr.net/npm/@fluentui/svg-icons@1.1.341/icons/person_arrow_left_24_regular.svg" width="24" height="24" alt="Person Arrow Left">

Person Arrow Left icon in Blazor

Microsoft's Fluent UI Blazor icons package:

dotnet add package Microsoft.FluentUI.AspNetCore.Components.Icons

<FluentIcon Value="@(new Icons.Regular.Size24.PersonArrowLeft())" />

Person Arrow Left icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.person_arrow_left_24_regular)

Person Arrow Left icon in WinUI / WPF

Add FluentSystemIcons-Regular.ttf from Microsoft's repository to your app, then use the glyph:

<!-- WinUI 3 (font in Assets/Fonts) -->
<FontIcon FontFamily="ms-appx:///Assets/Fonts/FluentSystemIcons-Regular.ttf#FluentSystemIcons-Regular" Glyph="&#xF5C5;" FontSize="24" />

<!-- WPF (font in Fonts/, Build Action: Resource) -->
<TextBlock FontFamily="pack://application:,,,/Fonts/#FluentSystemIcons-Regular" Text="&#xF5C5;" FontSize="24" />

Person Arrow Left icon in Icon font

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/microsoft/fluentui-system-icons@9cf8af0f95a555918a60b8147a2f33a6a1248442/fonts/FluentSystemIcons-Regular.css">

<i class="icon-ic_fluent_person_arrow_left_24_regular"></i>

/* or use the code point in your own CSS */
.icon::before {
  font-family: "FluentSystemIcons-Regular";
  content: "\f5c5";
  font-size: 24px;
}

Person Arrow Left icon in Android

// build.gradle
implementation("com.microsoft.design:fluent-system-icons:1.1.341@aar")

<!-- layout XML -->
<ImageView android:src="@drawable/ic_fluent_person_arrow_left_24_regular" />

// Kotlin
R.drawable.ic_fluent_person_arrow_left_24_regular

Person Arrow Left icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .personArrowLeft24Regular)

Person Arrow Left icon in Power Apps

Paste into an Image control's Image property. The Copy button copies the full formula with this icon's SVG.

"data:image/svg+xml;utf8, " & EncodeUrl("<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'>…</svg>")

Use the Person Arrow Left 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 { PersonArrowLeft24Regular, PersonArrowLeft24Filled } from "@fluentui/react-icons";

export function Example() {
  return <PersonArrowLeft24Regular aria-label="Person Arrow Left" />;
}

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_arrow_left_24_regular.svg" width="24" height="24" alt="Person Arrow Left">

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="M17.5004 12.0003C20.5379 12.0003 23.0004 14.4627 23.0004 17.5003C23.0004 20.5378 20.5379 23.0003 17.5004 23.0003C14.4628 23.0003 12.0004 20.5378 12.0004 17.5003C12.0004 14.4627 14.4628 12.0003 17.5004 12.0003ZM12.0226 13.9996C11.7259 14.4629 11.4864 14.9663 11.314 15.4999L4.25391 15.5002C3.83969 15.5002 3.50391 15.836 3.50391 16.2502V17.1575C3.50391 17.8132 3.7899 18.4362 4.28707 18.8636C5.54516 19.9453 7.44117 20.5013 10.0004 20.5013C10.5992 20.5013 11.1618 20.4709 11.6885 20.4104C11.9374 20.9105 12.2512 21.3743 12.6175 21.7908C11.8153 21.9315 10.9423 22.0013 10.0004 22.0013C7.11087 22.0013 4.87205 21.3447 3.30918 20.001C2.48056 19.2887 2.00391 18.2503 2.00391 17.1575V16.2502C2.00391 15.0075 3.01127 14.0002 4.25391 14.0002L12.0226 13.9996ZM16.7196 14.5889L16.6503 14.6467L14.1347 17.163L14.0941 17.2137L14.0594 17.2711L14.0272 17.3491L14.0156 17.3923L14.0044 17.4787L14.0082 17.5661L14.0271 17.6513L14.0591 17.729L14.0837 17.7714L14.1346 17.8374L16.6503 20.3538C16.8456 20.5491 17.1622 20.5491 17.3574 20.3538C17.531 20.1802 17.5503 19.9108 17.4153 19.716L17.3574 19.6467L15.7114 18.0003H20.5004C20.7458 18.0003 20.95 17.8234 20.9923 17.5901L21.0004 17.5003C21.0004 17.2548 20.8235 17.0507 20.5902 17.0083L20.5004 17.0003H15.7114L17.3574 15.3538C17.531 15.1802 17.5503 14.9108 17.4153 14.716L17.3574 14.6467C17.1839 14.4731 16.9145 14.4539 16.7196 14.5889ZM10.0004 2.00488C12.7618 2.00488 15.0004 4.24346 15.0004 7.00488C15.0004 9.76631 12.7618 12.0049 10.0004 12.0049C7.23894 12.0049 5.00036 9.76631 5.00036 7.00488C5.00036 4.24346 7.23894 2.00488 10.0004 2.00488ZM10.0004 3.50488C8.06737 3.50488 6.50036 5.07189 6.50036 7.00488C6.50036 8.93788 8.06737 10.5049 10.0004 10.5049C11.9334 10.5049 13.5004 8.93788 13.5004 7.00488C13.5004 5.07189 11.9334 3.50488 10.0004 3.50488Z" fill="currentColor"/></svg>

Details

NamePerson Arrow Left
StylesRegular (outlined), Filled
Sizes16 px, 20 px, 24 px
Regular (outlined) fileic_fluent_person_arrow_left_24_regular.svg
Filled fileic_fluent_person_arrow_left_24_filled.svg
React (Regular)PersonArrowLeft16Regular, PersonArrowLeft20Regular, PersonArrowLeft24Regular
React (Filled)PersonArrowLeft16Filled, PersonArrowLeft20Filled, PersonArrowLeft24Filled
LicenseMIT (© Microsoft Corporation)

Keywords

humanpatientcontactguestmeeting

Related icons