Double Tap Swipe Down icon

Use the Double Tap Swipe Down 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 { DoubleTapSwipeDown24Regular, DoubleTapSwipeDown24Filled } from "@fluentui/react-icons";

export function Example() {
  return <DoubleTapSwipeDown24Regular aria-label="Double Tap Swipe Down" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_double_tap_swipe_down_24_regular.svg" width="24" height="24" alt="Double Tap Swipe Down">

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="M12.5303 21.7802C12.2374 22.0731 11.7626 22.0731 11.4697 21.7802L7.96967 18.2802C7.67678 17.9874 7.67678 17.5125 7.96967 17.2196C8.26256 16.9267 8.73744 16.9267 9.03033 17.2196L11.25 19.4393V8.74992C11.25 8.3357 11.5858 7.99992 12 7.99992C12.4142 7.99992 12.75 8.3357 12.75 8.74992V19.4393L14.9697 17.2196C15.2626 16.9267 15.7374 16.9267 16.0303 17.2196C16.3232 17.5125 16.3232 17.9874 16.0303 18.2802L12.5303 21.7802ZM5 9C5 12.2617 7.23085 15.0024 10.25 15.7795V14.2157C8.0704 13.4847 6.5 11.4258 6.5 9C6.5 5.96243 8.96243 3.5 12 3.5C15.0376 3.5 17.5 5.96243 17.5 9C17.5 11.4258 15.9296 13.4847 13.75 14.2157V15.7795C16.7691 15.0024 19 12.2617 19 9C19 5.13401 15.866 2 12 2C8.13401 2 5 5.13401 5 9ZM7.5 9C7.5 10.8646 8.63403 12.4643 10.25 13.147V11.437C9.49297 10.8924 9 10.0038 9 9C9 7.34315 10.3431 6 12 6C13.6569 6 15 7.34315 15 9C15 10.0038 14.507 10.8924 13.75 11.437V13.147C15.366 12.4643 16.5 10.8646 16.5 9C16.5 6.51472 14.4853 4.5 12 4.5C9.51472 4.5 7.5 6.51472 7.5 9Z" 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/double_tap_swipe_down_24_regular.svg";

Details

Keywords

actiontaptouchscreengesture