Hand Right Off icon
Used to wait in line to talk in video meetings. The Hand Right Off 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 Hand Right Off 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 { HandRightOff24Regular, HandRightOff24Filled } from "@fluentui/react-icons";
export function Example() {
return <HandRightOff24Regular aria-label="Hand Right Off" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_hand_right_off_24_regular.svg" width="24" height="24" alt="Hand Right Off"> 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="M4.8344 5.89512L2.21966 3.28033C1.92677 2.98743 1.92678 2.51256 2.21968 2.21967C2.51257 1.92678 2.98745 1.92678 3.28034 2.21968L21.7801 20.7198C22.073 21.0127 22.073 21.4876 21.7801 21.7805C21.4872 22.0734 21.0123 22.0734 20.7194 21.7805L16.5012 17.5621C15.727 18.3571 15.0801 19.2672 14.5838 20.2603C14.0505 21.3273 12.9601 22.0013 11.7672 22.0013H9.03943C7.99781 22.0013 6.97463 21.4977 6.4182 20.5446C5.67139 19.2654 4.5 16.9342 4.5 14.7536V7C4.5 6.60371 4.62056 6.21928 4.8344 5.89512ZM15.4405 16.5014L8.50409 9.56488V10.5C8.50409 10.9142 8.1683 11.25 7.75409 11.25C7.33988 11.25 7.00409 10.9142 7.00409 10.5V8.06485L6 7.06074V14.7536C6 16.5004 6.97783 18.528 7.7136 19.7883C7.97061 20.2285 8.46764 20.5013 9.03943 20.5013H11.7672C12.3918 20.5013 12.9628 20.1484 13.242 19.5897C13.8105 18.4523 14.5522 17.4104 15.4405 16.5014ZM9.5 5.25V6.3181L11 7.81813V3.99682C11 3.72415 11.2121 3.49729 11.4986 3.49707C11.789 3.49685 11.9981 3.72007 11.9981 3.99682V8.81622L13.4954 10.3136C13.4972 10.2926 13.4981 10.2714 13.4981 10.25V5.22345C13.4981 4.98399 13.7023 4.74762 13.9959 4.74591C14.2584 4.7443 14.5 4.99048 14.5 5.25V11.3182L16.1412 12.9594C16.1966 12.9158 16.2577 12.8697 16.3241 12.8227C16.6758 12.5737 17.1332 12.3272 17.6268 12.2407C18.1641 12.1466 18.6737 12.204 19.0124 12.379C19.221 12.4867 19.3843 12.644 19.4577 12.9073L17.7993 14.1541C17.7713 14.1752 17.7448 14.1982 17.7199 14.223L17.5623 14.3805L18.6229 15.4412L18.7428 15.3214L20.7007 13.8495C20.8891 13.7078 21 13.4858 21 13.25C21 12.1883 20.4687 11.4429 19.7008 11.0463C18.9851 10.6766 18.1185 10.6317 17.3678 10.7633C16.8491 10.8542 16.3849 11.0467 16 11.2581V5.25C16 4.18962 15.1118 3.23917 13.9866 3.24594C13.7753 3.24719 13.5744 3.27994 13.3872 3.33898C13.1247 2.58043 12.4176 1.99636 11.4974 1.99707C10.5817 1.99779 9.87538 2.58304 9.61197 3.33844C9.42187 3.27859 9.21688 3.24593 9 3.24593C8.26793 3.24593 7.6757 3.61911 7.33175 4.14981L8.50409 5.32217V5.25C8.50409 4.97174 8.71851 4.74593 9 4.74593C9.28687 4.74593 9.5 4.97151 9.5 5.25Z" 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/hand_right_off_24_regular.svg";Details
| Name | Hand Right Off |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_hand_right_off_24_regular.svg |
| Filled file | ic_fluent_hand_right_off_24_filled.svg |
| React components | HandRightOff24Regular, HandRightOff24Filled |
| License | MIT (© Microsoft Corporation) |