Fluent Icons

Bluetooth icon

Used for device bluetooth scenarios. The Bluetooth icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles in 6 sizes from 16 to 48 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_bluetooth_24_regular.svg

Bluetooth icon in React

npm install @fluentui/react-icons

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

export function Example() {
  return <Bluetooth24Regular aria-label="Bluetooth" />;
}

Bluetooth icon in SVG

npm install @fluentui/svg-icons

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

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

Bluetooth icon in Blazor

Microsoft's Fluent UI Blazor icons package:

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

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

Bluetooth icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.bluetooth_24_regular)

Bluetooth 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="&#xF1DF;" FontSize="24" />

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

Bluetooth 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_bluetooth_24_regular"></i>

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

Bluetooth icon in Android

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

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

// Kotlin
R.drawable.ic_fluent_bluetooth_24_regular

Bluetooth icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .bluetooth24Regular)

Bluetooth 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 Bluetooth 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 { Bluetooth24Regular, Bluetooth24Filled } from "@fluentui/react-icons";

export function Example() {
  return <Bluetooth24Regular aria-label="Bluetooth" />;
}

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_bluetooth_24_regular.svg" width="24" height="24" alt="Bluetooth">

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="M11.463 2.05709C11.7433 1.941 12.0658 2.00517 12.2803 2.21967L17.2803 7.21967C17.4284 7.36777 17.5079 7.57105 17.4994 7.78033C17.4909 7.9896 17.3953 8.1858 17.2358 8.32145L12.9081 12L17.2358 15.6785C17.3953 15.8142 17.4909 16.0104 17.4994 16.2197C17.5079 16.4289 17.4284 16.6322 17.2803 16.7803L12.2803 21.7803C12.0658 21.9948 11.7433 22.059 11.463 21.9429C11.1827 21.8268 11 21.5533 11 21.25V13.6218L7.23575 16.8215C6.92015 17.0897 6.44683 17.0513 6.17856 16.7357C5.9103 16.4201 5.94867 15.9468 6.26428 15.6785L10.592 12L6.26428 8.32145C5.94867 8.05319 5.9103 7.57987 6.17856 7.26426C6.44683 6.94866 6.92015 6.91028 7.23575 7.17854L11 10.3782V2.75C11 2.44665 11.1827 2.17318 11.463 2.05709ZM12.5 13.6218V19.4393L15.6446 16.2947L12.5 13.6218ZM12.5 10.3782L15.6446 7.70526L12.5 4.56066V10.3782Z" fill="currentColor"/></svg>

Details

NameBluetooth
StylesRegular (outlined), Filled
Sizes16 px, 20 px, 24 px, 28 px, 32 px, 48 px
Regular (outlined) fileic_fluent_bluetooth_24_regular.svg
Filled fileic_fluent_bluetooth_24_filled.svg
React (Regular)Bluetooth16Regular, Bluetooth20Regular, Bluetooth24Regular, Bluetooth28Regular, Bluetooth32Regular, Bluetooth48Regular
React (Filled)Bluetooth16Filled, Bluetooth20Filled, Bluetooth24Filled, Bluetooth28Filled, Bluetooth32Filled, Bluetooth48Filled
LicenseMIT (© Microsoft Corporation)

Keywords

deviceconnection

Related icons

Bluetooth ConnectedBluetooth DisabledBluetooth SearchingSpeaker BluetoothVideo BluetoothRouterServerServer LinkServer MultipleServer PlaySpeaker USBCellular 3G