Highway icon

Use the Highway 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 { Highway24Regular, Highway24Filled } from "@fluentui/react-icons";

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

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_highway_24_regular.svg" width="24" height="24" alt="Highway">

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="M7.49044 2.87004C7.55675 2.46117 7.27904 2.07597 6.87017 2.00966C6.46129 1.94336 6.07609 2.22107 6.00978 2.62994L3.00978 21.1299C2.94348 21.5388 3.22119 21.924 3.63006 21.9903C4.03893 22.0566 4.42414 21.7789 4.49044 21.37L7.49044 2.87004ZM17.9904 2.62994C17.9241 2.22107 17.5389 1.94336 17.1301 2.00966C16.7212 2.07597 16.4435 2.46117 16.5098 2.87004L19.5098 21.37C19.5761 21.7789 19.9613 22.0566 20.3702 21.9903C20.779 21.924 21.0567 21.5388 20.9904 21.1299L17.9904 2.62994ZM12.7501 2.74999C12.7501 2.33578 12.4143 1.99999 12.0001 1.99999C11.5859 1.99999 11.2501 2.33578 11.2501 2.74999V6.24999C11.2501 6.6642 11.5859 6.99999 12.0001 6.99999C12.4143 6.99999 12.7501 6.6642 12.7501 6.24999V2.74999ZM11.2501 13.75C11.2501 14.1642 11.5859 14.5 12.0001 14.5C12.4143 14.5 12.7501 14.1642 12.7501 13.75V10.25C12.7501 9.83578 12.4143 9.49999 12.0001 9.49999C11.5859 9.49999 11.2501 9.83578 11.2501 10.25V13.75ZM11.2501 17.75C11.2501 17.3358 11.5859 17 12.0001 17C12.4143 17 12.7501 17.3358 12.7501 17.75V21.25C12.7501 21.6642 12.4143 22 12.0001 22C11.5859 22 11.2501 21.6642 11.2501 21.25V17.75Z" 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/highway_24_regular.svg";

Details

Keywords

highwayfreewayroadtrafficdrivecartruckvanvehiclelane