Food Apple icon

Used to represent food based scenarios (restaurant, meals, etc). The Food Apple 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_food_apple_24_regular.svg

Food Apple icon in React

npm install @fluentui/react-icons

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

export function Example() {
  return <FoodApple24Regular aria-label="Food Apple" />;
}

Food Apple icon in SVG

npm install @fluentui/svg-icons

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

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

Food Apple icon in Blazor

Microsoft's Fluent UI Blazor icons package:

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

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

Food Apple icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.food_apple_24_regular)

Food Apple 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="&#xE668;" FontSize="24" />

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

Food Apple 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_food_apple_24_regular"></i>

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

Food Apple icon in Android

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

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

// Kotlin
R.drawable.ic_fluent_food_apple_24_regular

Food Apple icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .foodApple24Regular)

Food Apple 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 Food Apple 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 { FoodApple24Regular, FoodApple24Filled } from "@fluentui/react-icons";

export function Example() {
  return <FoodApple24Regular aria-label="Food Apple" />;
}

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_food_apple_24_regular.svg" width="24" height="24" alt="Food Apple">

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="M8.3974 11.2348C8.80357 11.1536 9.06699 10.7584 8.98576 10.3523C8.90454 9.94609 8.50943 9.68267 8.10325 9.7639C7.19986 9.94456 6.51776 10.5755 6.15473 11.4227C5.7955 12.261 5.7422 13.3089 6.02255 14.4311C6.12294 14.833 6.5301 15.0774 6.93196 14.977C7.33383 14.8766 7.57822 14.4694 7.47783 14.0676C7.25856 13.1898 7.33026 12.4877 7.53347 12.0135C7.73288 11.5482 8.05066 11.3041 8.3974 11.2348ZM5.47146 3.41925C5.38955 4.80533 5.8618 6.22082 6.88864 7.30168C5.01112 7.8413 3.51795 9.43905 3.22815 11.5176C2.89974 13.8731 3.38387 16.2702 4.60072 18.3136L4.95173 18.9031C4.96474 18.9249 4.97885 18.9461 4.994 18.9665L6.40996 20.8732C7.68641 22.5921 10.2013 22.752 11.6853 21.2087C11.857 21.0301 12.1429 21.0301 12.3147 21.2087C13.7986 22.752 16.3135 22.5921 17.59 20.8732L19.0059 18.9665C19.0211 18.9461 19.0352 18.9249 19.0482 18.9031L19.3992 18.3136C20.6161 16.2702 21.1002 13.8731 20.7718 11.5176C20.3631 8.58626 17.5611 6.61122 14.6629 7.21168L12.7608 7.60578L12.7577 7.60642C12.7881 6.82657 12.9097 5.98554 13.149 5.26776C13.4383 4.3998 13.8411 3.87802 14.2884 3.69165C14.6708 3.53233 14.8516 3.09323 14.6923 2.71088C14.533 2.32852 14.0939 2.14772 13.7115 2.30703C12.6588 2.74565 12.0616 3.78637 11.726 4.79342C11.7103 4.84045 11.6951 4.88777 11.6803 4.93536C11.4405 4.47093 11.1259 4.03506 10.7366 3.64578C9.64409 2.55322 8.18457 2.04949 6.75636 2.13413C6.06327 2.1752 5.51241 2.72616 5.47146 3.41925ZM6.96373 3.62637C7.94351 3.59961 8.92931 3.95977 9.67599 4.70644C10.4225 5.45295 10.7827 6.4385 10.7561 7.41806C10.5747 7.42302 10.3931 7.41471 10.2129 7.39316L9.596 7.26534C9.02771 7.09589 8.49258 6.78675 8.04382 6.33799C7.29731 5.59148 6.93714 4.60594 6.96373 3.62637ZM9.03272 8.68049L9.23508 8.72241C9.47508 8.7904 9.71898 8.84079 9.96471 8.87359L10.9349 9.07459C11.6375 9.22016 12.3625 9.22016 13.0651 9.07459L14.9672 8.68049C17.0162 8.25596 18.9972 9.65231 19.2862 11.7248C19.5675 13.7425 19.1528 15.7958 18.1104 17.5462L17.7789 18.1028L16.3857 19.9789C15.6623 20.9531 14.237 21.0437 13.3959 20.1691C12.634 19.3766 11.366 19.3766 10.604 20.1691C9.76298 21.0437 8.33765 20.9531 7.61421 19.9789L6.221 18.1028L5.88951 17.5462C4.84717 15.7958 4.43247 13.7425 4.71378 11.7248C5.00273 9.65231 6.98373 8.25596 9.03272 8.68049Z" fill="currentColor"/></svg>

Details

NameFood Apple
StylesRegular (outlined), Filled
Sizes20 px, 24 px
Regular (outlined) fileic_fluent_food_apple_24_regular.svg
Filled fileic_fluent_food_apple_24_filled.svg
React (Regular)FoodApple20Regular, FoodApple24Regular
React (Filled)FoodApple20Filled, FoodApple24Filled
LicenseMIT (© Microsoft Corporation)

Keywords

mealtravel

Related icons