Vehicle Subway Clock icon

Use the Vehicle Subway Clock 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 { VehicleSubwayClock24Regular, VehicleSubwayClock24Filled } from "@fluentui/react-icons";

export function Example() {
  return <VehicleSubwayClock24Regular aria-label="Vehicle Subway Clock" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_vehicle_subway_clock_24_regular.svg" width="24" height="24" alt="Vehicle Subway Clock">

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="M12 6.5C12 3.46243 9.53757 1 6.5 1C3.46243 1 1 3.46243 1 6.5C1 9.53757 3.46243 12 6.5 12C9.53757 12 12 9.53757 12 6.5ZM6.5 3C6.77614 3 7 3.22386 7 3.5V6H9C9.27614 6 9.5 6.22386 9.5 6.5C9.5 6.77614 9.27614 7 9 7H6.5C6.22386 7 6 6.77614 6 6.5V3.5C6 3.22386 6.22386 3 6.5 3ZM6.5 13C7.38759 13 8.23363 12.8221 9.0044 12.5H18.5L18.5002 6.75C18.5002 5.50736 17.4928 4.5 16.2502 4.5H12.6865C12.5142 3.96653 12.2747 3.46321 11.9782 3H16.2502C18.3212 3 20.0002 4.67893 20.0002 6.75V15.75C20.0002 17.5253 18.7666 19.0124 17.1099 19.401L19.5726 20.5729C19.9466 20.7509 20.1054 21.1985 19.9273 21.5725C19.7641 21.9153 19.3744 22.0773 19.0226 21.9647L18.9277 21.9271L13.83 19.5H10.169L5.07263 21.9271C4.69865 22.1052 4.25111 21.9464 4.07303 21.5725C3.89495 21.1985 4.05375 20.7509 4.42772 20.5729L6.89005 19.4009C5.23353 19.0121 4.00017 17.5251 4.00017 15.75V12.5019C4.76972 12.8228 5.61417 13 6.5 13ZM18.5002 15.75L18.5 14H5.5L5.50017 15.75C5.50017 16.9926 6.50753 18 7.75017 18H16.2502C17.4928 18 18.5002 16.9926 18.5002 15.75ZM8.00018 15C8.55246 15 9.00018 15.4477 9.00018 16C9.00018 16.5523 8.55246 17 8.00018 17C7.44789 17 7.00017 16.5523 7.00017 16C7.00017 15.4477 7.44789 15 8.00018 15ZM16.0002 15C16.5525 15 17.0002 15.4477 17.0002 16C17.0002 16.5523 16.5525 17 16.0002 17C15.4479 17 15.0002 16.5523 15.0002 16C15.0002 15.4477 15.4479 15 16.0002 15Z" fill="currentColor"/></svg>

Use it from the SVG package

Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:

npm install @fluentui/svg-icons

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

Details

Keywords

travelridemapcommutedistanceeventvehiclecartruckautomobileclocktime