Fluent Icons

Money Calculator icon

Used in retail, purchase and invoicing scenarios. The Money Calculator 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_money_calculator_24_regular.svg

Money Calculator icon in React

npm install @fluentui/react-icons

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

export function Example() {
  return <MoneyCalculator24Regular aria-label="Money Calculator" />;
}

Money Calculator icon in SVG

npm install @fluentui/svg-icons

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

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

Money Calculator icon in Blazor

Microsoft's Fluent UI Blazor icons package:

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

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

Money Calculator icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.money_calculator_24_regular)

Money Calculator 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="&#xE819;" FontSize="24" />

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

Money Calculator 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_money_calculator_24_regular"></i>

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

Money Calculator icon in Android

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

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

// Kotlin
R.drawable.ic_fluent_money_calculator_24_regular

Money Calculator icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .moneyCalculator24Regular)

Money Calculator 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 Money Calculator 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 { MoneyCalculator24Regular, MoneyCalculator24Filled } from "@fluentui/react-icons";

export function Example() {
  return <MoneyCalculator24Regular aria-label="Money Calculator" />;
}

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_money_calculator_24_regular.svg" width="24" height="24" alt="Money Calculator">

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.5 7C8.84315 7 7.5 8.34315 7.5 10C7.5 11.6569 8.84315 13 10.5 13C12.1569 13 13.5 11.6569 13.5 10C13.5 8.34315 12.1569 7 10.5 7ZM9 10C9 9.17157 9.67157 8.5 10.5 8.5C11.3284 8.5 12 9.17157 12 10C12 10.8284 11.3284 11.5 10.5 11.5C9.67157 11.5 9 10.8284 9 10ZM2 6.25C2 5.00736 3.00736 4 4.25 4H16.75C17.9926 4 19 5.00736 19 6.25V11H17.5V8.5H16.75C15.5074 8.5 14.5 7.49264 14.5 6.25V5.5H6.5V6.25C6.5 7.49264 5.49264 8.5 4.25 8.5H3.5V11.5H4.25C5.49264 11.5 6.5 12.5074 6.5 13.75V14.5H14V16H4.25C3.00736 16 2 14.9926 2 13.75V6.25ZM4.25 5.5C3.83579 5.5 3.5 5.83579 3.5 6.25V7H4.25C4.66421 7 5 6.66421 5 6.25V5.5H4.25ZM17.5 7V6.25C17.5 5.83579 17.1642 5.5 16.75 5.5H16V6.25C16 6.66421 16.3358 7 16.75 7H17.5ZM3.5 13.75C3.5 14.1642 3.83579 14.5 4.25 14.5H5V13.75C5 13.3358 4.66421 13 4.25 13H3.5V13.75ZM4.40137 17.5H14V19H7.00002C5.8896 19 4.92008 18.3967 4.40137 17.5ZM22 11V9.00002C22 7.8896 21.3967 6.92008 20.5 6.40137V11H22ZM16.5 12C15.6716 12 15 12.6716 15 13.5V21.5C15 22.3284 15.6716 23 16.5 23H21.4998C22.3282 23 22.9998 22.3284 22.9998 21.5V13.5C22.9998 12.6716 22.3282 12 21.4998 12H16.5ZM17 16.5H17.9998C18.2759 16.5 18.4998 16.7239 18.4998 17C18.4998 17.2761 18.2759 17.5 17.9998 17.5H17C16.7239 17.5 16.5 17.2761 16.5 17C16.5 16.7239 16.7239 16.5 17 16.5ZM20 16.5H21C21.2761 16.5 21.5 16.7239 21.5 17C21.5 17.2761 21.2761 17.5 21 17.5H20C19.7239 17.5 19.5 17.2761 19.5 17C19.5 16.7239 19.7239 16.5 20 16.5ZM17 18.5H17.9998C18.2759 18.5 18.4998 18.7239 18.4998 19C18.4998 19.2761 18.2759 19.5 17.9998 19.5H17C16.7239 19.5 16.5 19.2761 16.5 19C16.5 18.7239 16.7239 18.5 17 18.5ZM20 18.5H21C21.2761 18.5 21.5 18.7239 21.5 19C21.5 19.2761 21.2761 19.5 21 19.5H20C19.7239 19.5 19.5 19.2761 19.5 19C19.5 18.7239 19.7239 18.5 20 18.5ZM17 20.5H17.9998C18.2759 20.5 18.4998 20.7239 18.4998 21C18.4998 21.2761 18.2759 21.5 17.9998 21.5H17C16.7239 21.5 16.5 21.2761 16.5 21C16.5 20.7239 16.7239 20.5 17 20.5ZM20 20.5H21C21.2761 20.5 21.5 20.7239 21.5 21C21.5 21.2761 21.2761 21.5 21 21.5H20C19.7239 21.5 19.5 21.2761 19.5 21C19.5 20.7239 19.7239 20.5 20 20.5ZM16.4999 13.9999C16.4999 13.7238 16.7238 13.4999 16.9999 13.4999H20.9999C21.276 13.4999 21.4999 13.7238 21.4999 13.9999V14.9999C21.4999 15.276 21.276 15.4999 20.9999 15.4999H16.9999C16.7238 15.4999 16.4999 15.276 16.4999 14.9999V13.9999Z" fill="currentColor"/></svg>

Details

NameMoney Calculator
StylesRegular (outlined), Filled
Sizes20 px, 24 px
Regular (outlined) fileic_fluent_money_calculator_24_regular.svg
Filled fileic_fluent_money_calculator_24_filled.svg
React (Regular)MoneyCalculator20Regular, MoneyCalculator24Regular
React (Filled)MoneyCalculator20Filled, MoneyCalculator24Filled
LicenseMIT (© Microsoft Corporation)

Keywords

currencyretailcashpurchase

Related icons

MoneyMoney DismissMoney HandMoney OffMoney SettingsPeople MoneyPerson MoneyReceipt MoneyReceiptReceipt AddReceipt BagReceipt Cube