Haptic Strong icon
Used to represent haptic feedback. The Haptic Strong icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Haptic Strong 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 { HapticStrong24Regular, HapticStrong24Filled } from "@fluentui/react-icons";
export function Example() {
return <HapticStrong24Regular aria-label="Haptic Strong" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_haptic_strong_24_regular.svg" width="24" height="24" alt="Haptic Strong"> 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="M10.251 21.0001C10.2 21.0001 10.148 20.9951 10.097 20.9841C9.576 20.8751 5 19.8341 5 16.8701C5 15.2031 6.465 14.4101 7.643 13.7711C8.798 13.1451 9.5 12.7121 9.5 11.9911C9.5 11.2701 8.799 10.8401 7.643 10.2151C6.466 9.57706 5 8.78406 5 7.12006C5 4.16006 9.575 3.12406 10.098 3.01606C10.497 2.93206 10.9 3.19206 10.984 3.59706C11.069 4.00206 10.809 4.40006 10.404 4.48506C9.391 4.69706 6.501 5.63706 6.501 7.12106C6.501 7.84006 7.202 8.27106 8.357 8.89706C9.535 9.53506 11.001 10.3281 11.001 11.9931C11.001 13.6581 9.536 14.4531 8.358 15.0921C7.203 15.7181 6.501 16.1511 6.501 16.8721C6.501 18.3661 9.392 19.3061 10.404 19.5171C10.809 19.6021 11.069 19.9991 10.985 20.4051C10.911 20.7591 10.599 21.0021 10.252 21.0021L10.251 21.0001ZM18.984 20.4031C19.068 19.9971 18.808 19.6001 18.403 19.5151C17.39 19.3041 14.5 18.3641 14.5 16.8701C14.5 16.1491 15.202 15.7161 16.357 15.0901C17.535 14.4521 19 13.6581 19 11.9911C19 10.3241 17.534 9.53306 16.356 8.89506C15.201 8.27006 14.5 7.83806 14.5 7.11906C14.5 5.63606 17.391 4.69606 18.403 4.48306C18.808 4.39806 19.068 4.00106 18.983 3.59506C18.899 3.19006 18.496 2.93006 18.097 3.01406C17.575 3.12206 12.999 4.15906 12.999 7.11806C12.999 8.78306 14.465 9.57606 15.642 10.2131C16.798 10.8381 17.499 11.2701 17.499 11.9891C17.499 12.7081 16.797 13.1431 15.642 13.7691C14.464 14.4071 12.999 15.2011 12.999 16.8681C12.999 19.8321 17.574 20.8731 18.096 20.9821C18.148 20.9931 18.2 20.9981 18.25 20.9981C18.598 20.9981 18.909 20.7551 18.983 20.4011L18.984 20.4031Z" 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/haptic_strong_24_regular.svg";Details
| Name | Haptic Strong |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_haptic_strong_24_regular.svg |
| Filled file | ic_fluent_haptic_strong_24_filled.svg |
| React components | HapticStrong24Regular, HapticStrong24Filled |
| License | MIT (© Microsoft Corporation) |
Keywords
devicevibrateshakesilencedalertnotificationtactilefeedbacktouch