Pulse icon

Use the Pulse 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 { Pulse24Regular, Pulse24Filled } from "@fluentui/react-icons";

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

Use it in HTML

Reference the SVG file directly:

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

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.46238 6.80905L11.746 20.426C11.9236 21.1626 12.957 21.2011 13.1891 20.4798L16.4456 10.3575L17.0318 12.4532C17.1224 12.7772 17.4176 13.0012 17.7541 13.0012H21.2477C21.6619 13.0012 21.9977 12.6654 21.9977 12.2512C21.9977 11.837 21.6619 11.5012 21.2477 11.5012H18.3231L17.2181 7.55053C17.0179 6.83439 16.0096 6.81496 15.7819 7.52284L12.5785 17.4797L9.22531 3.57419C9.04279 2.81728 7.97039 2.80542 7.77117 3.5581L5.66883 11.5012H2.75C2.33579 11.5012 2 11.837 2 12.2512C2 12.6654 2.33579 13.0012 2.75 13.0012H6.24614C6.58645 13.0012 6.88411 12.7721 6.97118 12.4431L8.46238 6.80905Z" 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/pulse_24_regular.svg";

Details

Keywords

healthmedicinemedicalhospitaldoctor