Star Dismiss icon

Used in general rating scenarios. The Star Dismiss icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles in 4 sizes from 16 to 28 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_star_dismiss_24_regular.svg

Star Dismiss icon in React

npm install @fluentui/react-icons

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

export function Example() {
  return <StarDismiss24Regular aria-label="Star Dismiss" />;
}

Star Dismiss icon in SVG

npm install @fluentui/svg-icons

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

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

Star Dismiss icon in Blazor

Microsoft's Fluent UI Blazor icons package:

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

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

Star Dismiss icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.star_dismiss_24_regular)

Star Dismiss 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="&#xEBA6;" FontSize="24" />

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

Star Dismiss 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_star_dismiss_24_regular"></i>

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

Star Dismiss icon in Android

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

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

// Kotlin
R.drawable.ic_fluent_star_dismiss_24_regular

Star Dismiss icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .starDismiss24Regular)

Star Dismiss 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 Star Dismiss 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 { StarDismiss24Regular, StarDismiss24Filled } from "@fluentui/react-icons";

export function Example() {
  return <StarDismiss24Regular aria-label="Star Dismiss" />;
}

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_star_dismiss_24_regular.svg" width="24" height="24" alt="Star Dismiss">

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="M10.7878 3.10312C11.283 2.09975 12.7138 2.09974 13.209 3.10312L15.567 7.88085L20.8395 8.64699C21.9468 8.80789 22.3889 10.1687 21.5877 10.9497L20.6827 11.8318C20.2104 11.566 19.7016 11.3576 19.1656 11.2159L20.323 10.0877L15.2732 9.35392C14.8335 9.29002 14.4534 9.01385 14.2568 8.61541L11.9984 4.03952L9.74008 8.61541C9.54344 9.01385 9.16332 9.29002 8.72361 9.35392L3.67382 10.0877L7.32788 13.6495C7.64606 13.9597 7.79125 14.4065 7.71614 14.8445L6.85353 19.8739L11.0028 17.6925C11.0185 18.2348 11.1007 18.7605 11.2414 19.2617L7.28252 21.343C6.29213 21.8637 5.13459 21.0227 5.32374 19.9198L6.2244 14.6686L2.40916 10.9497C1.60791 10.1687 2.05005 8.80789 3.15735 8.64699L8.42988 7.88085L10.7878 3.10312ZM23 17.5005C23 20.5381 20.5376 23.0005 17.5 23.0005C14.4624 23.0005 12 20.5381 12 17.5005C12 14.4629 14.4624 12.0005 17.5 12.0005C20.5376 12.0005 23 14.4629 23 17.5005ZM15.8536 15.1469C15.6583 14.9517 15.3417 14.9517 15.1464 15.1469C14.9512 15.3422 14.9512 15.6588 15.1464 15.8541L16.7929 17.5005L15.1464 19.1469C14.9512 19.3422 14.9512 19.6588 15.1464 19.8541C15.3417 20.0493 15.6583 20.0493 15.8536 19.8541L17.5 18.2076L19.1464 19.8541C19.3417 20.0493 19.6583 20.0493 19.8536 19.8541C20.0488 19.6588 20.0488 19.3422 19.8536 19.1469L18.2071 17.5005L19.8536 15.8541C20.0488 15.6588 20.0488 15.3422 19.8536 15.1469C19.6583 14.9517 19.3417 14.9517 19.1464 15.1469L17.5 16.7934L15.8536 15.1469Z" fill="currentColor"/></svg>

Details

NameStar Dismiss
StylesRegular (outlined), Filled
Sizes16 px, 20 px, 24 px, 28 px
Regular (outlined) fileic_fluent_star_dismiss_24_regular.svg
Filled fileic_fluent_star_dismiss_24_filled.svg
React (Regular)StarDismiss16Regular, StarDismiss20Regular, StarDismiss24Regular, StarDismiss28Regular
React (Filled)StarDismiss16Filled, StarDismiss20Filled, StarDismiss24Filled, StarDismiss28Filled
LicenseMIT (© Microsoft Corporation)

Keywords

favoriteratingvotexclose

Related icons