Fluent Icons

Network Adapter icon

Used to represent a network adapter for devices. The Network Adapter icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles on a 16 px grid. 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, 16 px

ic_fluent_network_adapter_16_regular.svg

Network Adapter icon in React

npm install @fluentui/react-icons

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

export function Example() {
  return <NetworkAdapter16Regular aria-label="Network Adapter" />;
}

Network Adapter icon in SVG

npm install @fluentui/svg-icons

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

<!-- or load it from a CDN -->
<img src="https://cdn.jsdelivr.net/npm/@fluentui/[email protected]/icons/network_adapter_16_regular.svg" width="16" height="16" alt="Network Adapter">

Network Adapter icon in Blazor

Microsoft's Fluent UI Blazor icons package:

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

<FluentIcon Value="@(new Icons.Regular.Size16.NetworkAdapter())" />

Network Adapter icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.network_adapter_16_regular)

Network Adapter 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="&#xF0F5;" FontSize="16" />

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

Network Adapter 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_network_adapter_16_regular"></i>

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

Network Adapter icon in Android

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

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

// Kotlin
R.drawable.ic_fluent_network_adapter_16_regular

Network Adapter icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .networkAdapter16Regular)

Network Adapter 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='16' height='16' viewBox='0 0 16 16'>…</svg>")

Use the Network Adapter 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 { NetworkAdapter16Regular, NetworkAdapter16Filled } from "@fluentui/react-icons";

export function Example() {
  return <NetworkAdapter16Regular aria-label="Network Adapter" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_network_adapter_16_regular.svg" width="16" height="16" alt="Network Adapter">

Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent: 

<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M4 6.5v3a.5.5 0 1 1-1 0v-3a.5.5 0 1 1 1 0M6.5 6a.5.5 0 0 0-.5.5v3a.5.5 0 1 0 1 0v-3a.5.5 0 0 0-.5-.5m3 0a.5.5 0 0 0-.5.5v3a.5.5 0 1 0 1 0v-3a.5.5 0 0 0-.5-.5m3 0a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 1 0v-3a.5.5 0 0 0-.5-.5m2.5-.5v5a1.5 1.5 0 0 1-1.5 1.5H13v1.5a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5V12H2v1.5a.5.5 0 0 1-1 0V3H.5a.5.5 0 0 1 0-1H1a1 1 0 0 1 1 1v1h11.5A1.5 1.5 0 0 1 15 5.5M7 13h2v-1H7zm5-1h-2v1h2zm2-6.5a.5.5 0 0 0-.5-.5H2v6h11.5a.5.5 0 0 0 .5-.5z"/></svg>

Details

NameNetwork Adapter
StylesRegular (outlined), Filled
Sizes16 px
Regular (outlined) fileic_fluent_network_adapter_16_regular.svg
Filled fileic_fluent_network_adapter_16_filled.svg
React (Regular)NetworkAdapter16Regular
React (Filled)NetworkAdapter16Filled
LicenseMIT (© Microsoft Corporation)

Keywords

network adapterhardwaredevice

Related icons

Network CheckVirtual NetworkVirtual Network ToolboxHard DriveHard Drive CallKeyboard MouseMemoryBluetoothBluetooth ConnectedBluetooth DisabledBluetooth SearchingDeveloper Board