Vehicle Cab icon

Used to represent vehicle travel scenarios. The Vehicle Cab icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles in 4 sizes from 16 to 28 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_vehicle_cab_24_regular.svg

Vehicle Cab icon in React

npm install @fluentui/react-icons

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

export function Example() {
  return <VehicleCab24Regular aria-label="Vehicle Cab" />;
}

Vehicle Cab icon in SVG

npm install @fluentui/svg-icons

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

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

Vehicle Cab icon in Blazor

Microsoft's Fluent UI Blazor icons package:

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

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

Vehicle Cab icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.vehicle_cab_24_regular)

Vehicle Cab 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="&#xF846;" FontSize="24" />

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

Vehicle Cab 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_vehicle_cab_24_regular"></i>

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

Vehicle Cab icon in Android

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

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

// Kotlin
R.drawable.ic_fluent_vehicle_cab_24_regular

Vehicle Cab icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .vehicleCab24Regular)

Vehicle Cab 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 Vehicle Cab 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 { VehicleCab24Regular, VehicleCab24Filled } from "@fluentui/react-icons";

export function Example() {
  return <VehicleCab24Regular aria-label="Vehicle Cab" />;
}

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_vehicle_cab_24_regular.svg" width="24" height="24" alt="Vehicle Cab">

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.00537 13C8.00537 13.5523 7.55766 14 7.00537 14C6.45309 14 6.00537 13.5523 6.00537 13C6.00537 12.4477 6.45309 12 7.00537 12C7.55766 12 8.00537 12.4477 8.00537 13ZM16.9998 14C17.552 14 17.9998 13.5523 17.9998 13C17.9998 12.4477 17.552 12 16.9998 12C16.4475 12 15.9998 12.4477 15.9998 13C15.9998 13.5523 16.4475 14 16.9998 14ZM9.48438 14.75C9.48438 14.3358 9.82016 14 10.2344 14H13.7188C14.133 14 14.4688 14.3358 14.4688 14.75C14.4688 15.1642 14.133 15.5 13.7188 15.5H10.2344C9.82016 15.5 9.48438 15.1642 9.48438 14.75ZM9.26562 1.99219C8.85141 1.99219 8.51562 2.32797 8.51562 2.74219V4.5H7.85159C6.42162 4.5 5.15966 5.43465 4.74277 6.8025L4.68258 7H3.75C3.33579 7 3 7.33579 3 7.75C3 8.16421 3.33579 8.5 3.75 8.5H4.28302L4.08121 9.327C3.43291 9.72189 3 10.4354 3 11.25V19.75C3 20.7165 3.7835 21.5 4.75 21.5H6.25C7.2165 21.5 8 20.7165 8 19.75V18.5H16V19.75C16 20.7165 16.7835 21.5 17.75 21.5H19.25C20.2165 21.5 21 20.7165 21 19.75V11.25C21 10.4347 20.5663 9.72063 19.9171 9.32596L19.7106 8.5H20.25C20.6642 8.5 21 8.16421 21 7.75C21 7.33579 20.6642 7 20.25 7H19.308L19.2529 6.81612C18.8404 5.44142 17.5751 4.5 16.1399 4.5H15.5V2.74219C15.5 2.32797 15.1642 1.99219 14.75 1.99219H9.26562ZM14 4.5H10.0156V3.49219H14V4.5ZM7.85159 6H16.1399C16.9127 6 17.5941 6.50692 17.8161 7.24714L18.0266 7.94881L18.2894 9H5.70503L5.96165 7.94839L6.17761 7.23981C6.40209 6.50327 7.08161 6 7.85159 6ZM4.5 17V11.25C4.5 10.8358 4.83579 10.5 5.25 10.5H18.75C19.1642 10.5 19.5 10.8358 19.5 11.25V17H4.5ZM4.5 19.75V18.5H6.5V19.75C6.5 19.8881 6.38807 20 6.25 20H4.75C4.61193 20 4.5 19.8881 4.5 19.75ZM19.5 18.5V19.75C19.5 19.8881 19.3881 20 19.25 20H17.75C17.6119 20 17.5 19.8881 17.5 19.75V18.5H19.5Z" fill="currentColor"/></svg>

Details

NameVehicle Cab
StylesRegular (outlined), Filled
Sizes16 px, 20 px, 24 px, 28 px
Regular (outlined) fileic_fluent_vehicle_cab_24_regular.svg
Filled fileic_fluent_vehicle_cab_24_filled.svg
React (Regular)VehicleCab16Regular, VehicleCab20Regular, VehicleCab24Regular, VehicleCab28Regular
React (Filled)VehicleCab16Filled, VehicleCab20Filled, VehicleCab24Filled, VehicleCab28Filled
LicenseMIT (© Microsoft Corporation)

Keywords

travelridemapcommutedistanceeventvehiclecartruckautomobile

Related icons