Eraser Segment icon

Used in erasing content scenarios. Contains size modifiers. The Eraser Segment icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles in 2 sizes from 20 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_eraser_segment_24_regular.svg

Eraser Segment icon in React

npm install @fluentui/react-icons

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

export function Example() {
  return <EraserSegment24Regular aria-label="Eraser Segment" />;
}

Eraser Segment icon in SVG

npm install @fluentui/svg-icons

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

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

Eraser Segment icon in Blazor

Microsoft's Fluent UI Blazor icons package:

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

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

Eraser Segment icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.eraser_segment_24_regular)

Eraser Segment 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="&#xE5E9;" FontSize="24" />

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

Eraser Segment 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_eraser_segment_24_regular"></i>

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

Eraser Segment icon in Android

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

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

// Kotlin
R.drawable.ic_fluent_eraser_segment_24_regular

Eraser Segment icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .eraserSegment24Regular)

Eraser Segment 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 Eraser Segment 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 { EraserSegment24Regular, EraserSegment24Filled } from "@fluentui/react-icons";

export function Example() {
  return <EraserSegment24Regular aria-label="Eraser Segment" />;
}

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_eraser_segment_24_regular.svg" width="24" height="24" alt="Eraser Segment">

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="M15.8413 2.66117C14.9682 1.77057 13.5372 1.76012 12.6511 2.63787L3.05274 12.1464C2.16133 13.0295 2.16448 14.4711 3.05972 15.3502L8.15877 20.3577C8.62571 20.8163 9.24205 21.0298 9.84815 20.9995H16.1145C16.433 22.0138 17.3806 22.7495 18.5 22.7495C19.8807 22.7495 21 21.6303 21 20.2495C21 18.8688 19.8807 17.7495 18.5 17.7495C17.3806 17.7495 16.433 18.4853 16.1145 19.4995H12.1614L20.7439 10.8273C21.6087 9.95347 21.612 8.54731 20.7514 7.66943L15.8413 2.66117ZM9.75 19.4995V19.5022C9.55542 19.506 9.35955 19.4346 9.20978 19.2875L4.11073 14.28C3.81231 13.9869 3.81126 13.5064 4.1084 13.2121L5.63726 11.6975L11.7363 17.7966L10.2684 19.2799C10.1382 19.4114 9.97142 19.4847 9.80042 19.4995H9.75ZM13.7068 3.70351C14.0022 3.41093 14.4791 3.41441 14.7702 3.71128L19.6802 8.71954C19.9671 9.01216 19.966 9.48088 19.6778 9.77216L12.7915 16.7304L6.70291 10.6418L13.7068 3.70351Z" fill="currentColor"/></svg>

Details

NameEraser Segment
StylesRegular (outlined), Filled
Sizes20 px, 24 px
Regular (outlined) fileic_fluent_eraser_segment_24_regular.svg
Filled fileic_fluent_eraser_segment_24_filled.svg
React (Regular)EraserSegment20Regular, EraserSegment24Regular
React (Filled)EraserSegment20Filled, EraserSegment24Filled
LicenseMIT (© Microsoft Corporation)

Keywords

undoremovedelete

Related icons