Fluent Icons

Cube Tree icon

Used for shipping, production scenarios. The Cube Tree 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
Xceed Toolkit Plus for WPF logoXceed Toolkit Plus for WPFSponsorUpgrade Your WPF UI with Xceed Toolkit Plus

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_cube_tree_24_regular.svg

Cube Tree icon in React

npm install @fluentui/react-icons

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

export function Example() {
  return <CubeTree24Regular aria-label="Cube Tree" />;
}

Cube Tree icon in SVG

npm install @fluentui/svg-icons

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

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

Cube Tree icon in Blazor

Microsoft's Fluent UI Blazor icons package:

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

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

Cube Tree icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.cube_tree_24_regular)

Cube Tree 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="&#xE43C;" FontSize="24" />

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

Cube Tree 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_cube_tree_24_regular"></i>

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

Cube Tree icon in Android

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

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

// Kotlin
R.drawable.ic_fluent_cube_tree_24_regular

Cube Tree icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .cubeTree24Regular)

Cube Tree 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 Cube Tree 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 { CubeTree24Regular, CubeTree24Filled } from "@fluentui/react-icons";

export function Example() {
  return <CubeTree24Regular aria-label="Cube Tree" />;
}

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_cube_tree_24_regular.svg" width="24" height="24" alt="Cube Tree">

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="M9.78849 5.51283C9.91947 5.11987 10.3442 4.9075 10.7372 5.03849L12 5.45943L13.2628 5.03849C13.6558 4.9075 14.0805 5.11987 14.2115 5.51283C14.3425 5.90579 14.1301 6.33053 13.7372 6.46151L12.75 6.79057V7.75C12.75 8.16421 12.4142 8.5 12 8.5C11.5858 8.5 11.25 8.16421 11.25 7.75V6.79057L10.2628 6.46151C9.86987 6.33053 9.6575 5.90579 9.78849 5.51283ZM12.2372 2.03849C12.0832 1.98717 11.9168 1.98717 11.7628 2.03849L8.01283 3.28849C7.70657 3.39057 7.5 3.67718 7.5 4V9C7.5 9.32282 7.70657 9.60943 8.01283 9.71151L11.25 10.7906V13H9.5C8.25736 13 7.25 14.0074 7.25 15.25V16.0945C5.95608 16.4275 5 17.6021 5 19C5 20.6569 6.34315 22 8 22C9.65685 22 11 20.6569 11 19C11 17.6021 10.0439 16.4275 8.75 16.0945V15.25C8.75 14.8358 9.08579 14.5 9.5 14.5H14.5C14.9142 14.5 15.25 14.8358 15.25 15.25V16.0945C13.9561 16.4275 13 17.6021 13 19C13 20.6569 14.3431 22 16 22C17.6569 22 19 20.6569 19 19C19 17.6021 18.0439 16.4275 16.75 16.0945V15.25C16.75 14.0074 15.7426 13 14.5 13H12.75V10.7906L15.9872 9.71151C16.2934 9.60943 16.5 9.32282 16.5 9V4C16.5 3.67718 16.2934 3.39057 15.9872 3.28849L12.2372 2.03849ZM9 8.45943V4.54057L12 3.54057L15 4.54057V8.45943L12 9.45943L9 8.45943ZM8 17.5C8.82843 17.5 9.5 18.1716 9.5 19C9.5 19.8284 8.82843 20.5 8 20.5C7.17157 20.5 6.5 19.8284 6.5 19C6.5 18.1716 7.17157 17.5 8 17.5ZM14.5 19C14.5 18.1716 15.1716 17.5 16 17.5C16.8284 17.5 17.5 18.1716 17.5 19C17.5 19.8284 16.8284 20.5 16 20.5C15.1716 20.5 14.5 19.8284 14.5 19Z" fill="currentColor"/></svg>

Details

NameCube Tree
StylesRegular (outlined), Filled
Sizes20 px, 24 px
Regular (outlined) fileic_fluent_cube_tree_24_regular.svg
Filled fileic_fluent_cube_tree_24_filled.svg
React (Regular)CubeTree20Regular, CubeTree24Regular
React (Filled)CubeTree20Filled, CubeTree24Filled
LicenseMIT (© Microsoft Corporation)

Keywords

packageshippingcargoproduction

Related icons

Document Bullet List CubeBoxBox Arrow LeftBox Arrow UpBox CheckmarkBox DismissBox EditBox MultipleBox Multiple Arrow LeftBox Multiple Arrow RightBox Multiple CheckmarkBox Multiple Search