directions car icon

directions-car-outline-rounded from Material Symbols by Google · Outline Rounded · Transit · Apache-2.0 Free for personal and commercial use.

Name
directions-car-outline-rounded
Set
Material Symbols
Style
Outline Rounded
Category
Transit
Viewbox
24×24
License
Apache 2.0

5 other variants in Material Symbols

directions-cardirections-car-outlinedirections-car-outline-sharpdirections-car-roundeddirections-car-sharp

The same icon in other sets

directions-carMaterial Symbols Light

More transit icons from Material Symbols

agricultureairlinesairport-shuttleambulanceauto-towingauto-transmissionbike-dockbike-lanebike-scooterboat-busboat-railwaybus-alertbus-map-pinbus-railwaycable-carcar-crashcar-defrost-leftcar-defrost-low-leftcar-defrost-low-rightcar-defrost-mid-leftcar-defrost-mid-low-leftcar-defrost-mid-low-rightcar-defrost-mid-rightcar-defrost-right

Use the directions car icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M6 19v.5q0 .625-.437 1.063T4.5 21t-1.062-.437T3 19.5v-7.15q0-.175.025-.35t.075-.325L4.975 6.35q.2-.6.725-.975T6.875 5h10.25q.65 0 1.175.375t.725.975l1.875 5.325q.05.15.075.325t.025.35v7.15q0 .625-.437 1.063T19.5 21t-1.062-.437T18 19.5V19zm-.2-9h12.4l-1.05-3H6.85zM5 12v5zm2.5 4q.625 0 1.063-.437T9 14.5t-.437-1.062T7.5 13t-1.062.438T6 14.5t.438 1.063T7.5 16m9 0q.625 0 1.063-.437T18 14.5t-.437-1.062T16.5 13t-1.062.438T15 14.5t.438 1.063T16.5 16M5 17h14v-5H5z"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsDirectionsCarOutlineRounded(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M6 19v.5q0 .625-.437 1.063T4.5 21t-1.062-.437T3 19.5v-7.15q0-.175.025-.35t.075-.325L4.975 6.35q.2-.6.725-.975T6.875 5h10.25q.65 0 1.175.375t.725.975l1.875 5.325q.05.15.075.325t.025.35v7.15q0 .625-.437 1.063T19.5 21t-1.062-.437T18 19.5V19zm-.2-9h12.4l-1.05-3H6.85zM5 12v5zm2.5 4q.625 0 1.063-.437T9 14.5t-.437-1.062T7.5 13t-1.062.438T6 14.5t.438 1.063T7.5 16m9 0q.625 0 1.063-.437T18 14.5t-.437-1.062T16.5 13t-1.062.438T15 14.5t.438 1.063T16.5 16M5 17h14v-5H5z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M6 19v.5q0 .625-.437 1.063T4.5 21t-1.062-.437T3 19.5v-7.15q0-.175.025-.35t.075-.325L4.975 6.35q.2-.6.725-.975T6.875 5h10.25q.65 0 1.175.375t.725.975l1.875 5.325q.05.15.075.325t.025.35v7.15q0 .625-.437 1.063T19.5 21t-1.062-.437T18 19.5V19zm-.2-9h12.4l-1.05-3H6.85zM5 12v5zm2.5 4q.625 0 1.063-.437T9 14.5t-.437-1.062T7.5 13t-1.062.438T6 14.5t.438 1.063T7.5 16m9 0q.625 0 1.063-.437T18 14.5t-.437-1.062T16.5 13t-1.062.438T15 14.5t.438 1.063T16.5 16M5 17h14v-5H5z"/></svg>
</template>

CSS

.icon-directions-car-outline-rounded {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M6%2019v.5q0%20.625-.437%201.063T4.5%2021t-1.062-.437T3%2019.5v-7.15q0-.175.025-.35t.075-.325L4.975%206.35q.2-.6.725-.975T6.875%205h10.25q.65%200%201.175.375t.725.975l1.875%205.325q.05.15.075.325t.025.35v7.15q0%20.625-.437%201.063T19.5%2021t-1.062-.437T18%2019.5V19zm-.2-9h12.4l-1.05-3H6.85zM5%2012v5zm2.5%204q.625%200%201.063-.437T9%2014.5t-.437-1.062T7.5%2013t-1.062.438T6%2014.5t.438%201.063T7.5%2016m9%200q.625%200%201.063-.437T18%2014.5t-.437-1.062T16.5%2013t-1.062.438T15%2014.5t.438%201.063T16.5%2016M5%2017h14v-5H5z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M6%2019v.5q0%20.625-.437%201.063T4.5%2021t-1.062-.437T3%2019.5v-7.15q0-.175.025-.35t.075-.325L4.975%206.35q.2-.6.725-.975T6.875%205h10.25q.65%200%201.175.375t.725.975l1.875%205.325q.05.15.075.325t.025.35v7.15q0%20.625-.437%201.063T19.5%2021t-1.062-.437T18%2019.5V19zm-.2-9h12.4l-1.05-3H6.85zM5%2012v5zm2.5%204q.625%200%201.063-.437T9%2014.5t-.437-1.062T7.5%2013t-1.062.438T6%2014.5t.438%201.063T7.5%2016m9%200q.625%200%201.063-.437T18%2014.5t-.437-1.062T16.5%2013t-1.062.438T15%2014.5t.438%201.063T16.5%2016M5%2017h14v-5H5z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols/directions-car-outline-rounded.svg?color=%231a73e8&size=48