Send Person icon

Used in message & sending scenarios. The Send Person 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_send_person_24_regular.svg

Send Person icon in React

npm install @fluentui/react-icons

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

export function Example() {
  return <SendPerson24Regular aria-label="Send Person" />;
}

Send Person icon in SVG

npm install @fluentui/svg-icons

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

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

Send Person icon in Blazor

Microsoft's Fluent UI Blazor icons package:

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

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

Send Person icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.send_person_24_regular)

Send Person 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="&#xF0614;" FontSize="24" />

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

Send Person 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_send_person_24_regular"></i>

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

Send Person icon in Android

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

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

// Kotlin
R.drawable.ic_fluent_send_person_24_regular

Send Person icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .sendPerson24Regular)

Send Person 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 Send Person 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 { SendPerson24Regular, SendPerson24Filled } from "@fluentui/react-icons";

export function Example() {
  return <SendPerson24Regular aria-label="Send Person" />;
}

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_send_person_24_regular.svg" width="24" height="24" alt="Send Person">

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="M5.69362 11.7526L2.29933 3.02443C2.0631 2.41696 2.65544 1.83602 3.2414 2.04252L3.33375 2.08177L21.3337 11.0818C21.852 11.3409 21.8844 12.0504 21.4309 12.3658L21.3337 12.4234L20.026 13.0773C19.6173 12.6513 19.1019 12.3285 18.5228 12.1518L19.3213 11.7526L4.4021 4.293L7.01109 11.002L13.6387 11.0026C14.0184 11.0026 14.3322 11.2847 14.3818 11.6508L14.3887 11.7526C14.3887 12.1323 14.1065 12.4461 13.7404 12.4957L13.6387 12.5026L7.01109 12.502L4.4021 19.2122L14.2077 14.3094C14.0733 14.681 14 15.082 14 15.5C14 15.6932 14.0157 15.8827 14.0458 16.0674L3.33375 21.4234C2.75077 21.7149 2.11746 21.1789 2.2688 20.5763L2.29933 20.4808L5.69362 11.7526ZM20 15.5C20 16.8807 18.8807 18 17.5 18C16.1193 18 15 16.8807 15 15.5C15 14.1193 16.1193 13 17.5 13C18.8807 13 20 14.1193 20 15.5ZM22 20.875C22 22.4315 20.7143 24 17.5 24C14.2857 24 13 22.4374 13 20.875V20.772C13 19.7929 13.7937 19 14.7727 19H20.2273C21.2063 19 22 19.793 22 20.772V20.875Z" fill="currentColor"/></svg>

Details

NameSend Person
StylesRegular (outlined), Filled
Sizes16 px, 20 px, 24 px
Regular (outlined) fileic_fluent_send_person_24_regular.svg
Filled fileic_fluent_send_person_24_filled.svg
React (Regular)SendPerson16Regular, SendPerson20Regular, SendPerson24Regular
React (Filled)SendPerson16Filled, SendPerson20Filled, SendPerson24Filled
LicenseMIT (© Microsoft Corporation)

Keywords

message

Related icons