WiFi 2 icon

Use the WiFi 2 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 { Wifi224Regular, Wifi224Filled } from "@fluentui/react-icons";

export function Example() {
  return <Wifi224Regular aria-label="WiFi 2" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_wifi_2_24_regular.svg" width="24" height="24" alt="WiFi 2">

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="M17.7449 10.751C18.3356 11.3418 18.8471 12.0584 19.2368 12.8203C19.4254 13.1891 19.2794 13.6409 18.9106 13.8295C18.5418 14.0182 18.09 13.8721 17.9013 13.5033C17.581 12.877 17.1608 12.2882 16.6842 11.8116C14.1215 9.24898 9.96666 9.24898 7.404 11.8116C6.90618 12.3095 6.50177 12.8692 6.19041 13.4848C6.00346 13.8544 5.55226 14.0025 5.18264 13.8155C4.81302 13.6286 4.66494 13.1774 4.8519 12.8077C5.23471 12.0509 5.73274 11.3616 6.34334 10.751C9.49178 7.60254 14.5964 7.60254 17.7449 10.751ZM15.643 13.8198C16.0906 14.2674 16.4588 14.8171 16.7151 15.402C16.8814 15.7814 16.7086 16.2237 16.3292 16.3899C15.9498 16.5562 15.5075 16.3834 15.3412 16.004C15.1581 15.5862 14.8945 15.1927 14.5823 14.8805C13.1796 13.4777 10.9053 13.4777 9.50257 14.8805C9.19206 15.191 8.93995 15.5692 8.75537 15.991C8.58933 16.3705 8.1471 16.5435 7.76762 16.3775C7.38815 16.2114 7.21512 15.7692 7.38117 15.3897C7.63862 14.8013 7.995 14.2667 8.44191 13.8198C10.4304 11.8313 13.6545 11.8313 15.643 13.8198ZM13.0606 16.4395C13.6464 17.0253 13.6464 17.9752 13.0606 18.5611C12.4747 19.1469 11.5248 19.1469 10.939 18.5611C10.3531 17.9752 10.3531 17.0253 10.939 16.4395C11.5248 15.8536 12.4747 15.8536 13.0606 16.4395Z" 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/wifi_2_24_regular.svg";

Details

Keywords

wirelessfidelityconnectinternetwebconnection