hand arrow down icon

hand-arrow-down-bold from Phosphor by Phosphor Icons · Bold · MIT Free for personal and commercial use.

Name: hand-arrow-down-bold
Set: Phosphor
Style: Bold
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

hand-arrow-down hand-arrow-down-duotone hand-arrow-down-fill hand-arrow-down-light hand-arrow-down-thin

Related icons in Phosphor

hand-arrow-up hand-coins hand-deposit hand-eye hand-fist hand-grabbing hand-heart hand-palm hand-peace hand-pointing hand-soap hand-swipe-left hand-swipe-right hand-tap hand-waving hand-withdraw

Use the hand arrow down icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M232.76 137.88a28.39 28.39 0 0 0-24.63-4.88L172 141.26V140a32 32 0 0 0-32-32H89.94a35.76 35.76 0 0 0-25.45 10.54L43 140H20a20 20 0 0 0-20 20v40a20 20 0 0 0 20 20h100a12 12 0 0 0 2.91-.36l64-16a11.4 11.4 0 0 0 1.79-.6l38.82-16.54c.23-.09.45-.19.67-.3a28.61 28.61 0 0 0 4.57-48.32M24 164h12v32H24Zm193.68.61l-37.51 16L118.52 196H60v-39l21.46-21.46a11.93 11.93 0 0 1 8.48-3.54H140a8 8 0 0 1 0 16h-28a12 12 0 0 0 0 24h32a12.2 12.2 0 0 0 2.69-.3l67-15.41l.47-.12a4.61 4.61 0 0 1 5.82 4.44a4.58 4.58 0 0 1-2.3 4m-66.17-84.12a12 12 0 0 1 17-17L180 75V24a12 12 0 0 1 24 0v51l11.51-11.52a12 12 0 0 1 17 17l-32 32a12 12 0 0 1-17 0Z"/></svg>

React

import type { SVGProps } from "react";

export function PhHandArrowDownBold(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M232.76 137.88a28.39 28.39 0 0 0-24.63-4.88L172 141.26V140a32 32 0 0 0-32-32H89.94a35.76 35.76 0 0 0-25.45 10.54L43 140H20a20 20 0 0 0-20 20v40a20 20 0 0 0 20 20h100a12 12 0 0 0 2.91-.36l64-16a11.4 11.4 0 0 0 1.79-.6l38.82-16.54c.23-.09.45-.19.67-.3a28.61 28.61 0 0 0 4.57-48.32M24 164h12v32H24Zm193.68.61l-37.51 16L118.52 196H60v-39l21.46-21.46a11.93 11.93 0 0 1 8.48-3.54H140a8 8 0 0 1 0 16h-28a12 12 0 0 0 0 24h32a12.2 12.2 0 0 0 2.69-.3l67-15.41l.47-.12a4.61 4.61 0 0 1 5.82 4.44a4.58 4.58 0 0 1-2.3 4m-66.17-84.12a12 12 0 0 1 17-17L180 75V24a12 12 0 0 1 24 0v51l11.51-11.52a12 12 0 0 1 17 17l-32 32a12 12 0 0 1-17 0Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M232.76 137.88a28.39 28.39 0 0 0-24.63-4.88L172 141.26V140a32 32 0 0 0-32-32H89.94a35.76 35.76 0 0 0-25.45 10.54L43 140H20a20 20 0 0 0-20 20v40a20 20 0 0 0 20 20h100a12 12 0 0 0 2.91-.36l64-16a11.4 11.4 0 0 0 1.79-.6l38.82-16.54c.23-.09.45-.19.67-.3a28.61 28.61 0 0 0 4.57-48.32M24 164h12v32H24Zm193.68.61l-37.51 16L118.52 196H60v-39l21.46-21.46a11.93 11.93 0 0 1 8.48-3.54H140a8 8 0 0 1 0 16h-28a12 12 0 0 0 0 24h32a12.2 12.2 0 0 0 2.69-.3l67-15.41l.47-.12a4.61 4.61 0 0 1 5.82 4.44a4.58 4.58 0 0 1-2.3 4m-66.17-84.12a12 12 0 0 1 17-17L180 75V24a12 12 0 0 1 24 0v51l11.51-11.52a12 12 0 0 1 17 17l-32 32a12 12 0 0 1-17 0Z"/></svg>
</template>

CSS

.icon-hand-arrow-down-bold {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M232.76%20137.88a28.39%2028.39%200%200%200-24.63-4.88L172%20141.26V140a32%2032%200%200%200-32-32H89.94a35.76%2035.76%200%200%200-25.45%2010.54L43%20140H20a20%2020%200%200%200-20%2020v40a20%2020%200%200%200%2020%2020h100a12%2012%200%200%200%202.91-.36l64-16a11.4%2011.4%200%200%200%201.79-.6l38.82-16.54c.23-.09.45-.19.67-.3a28.61%2028.61%200%200%200%204.57-48.32M24%20164h12v32H24Zm193.68.61l-37.51%2016L118.52%20196H60v-39l21.46-21.46a11.93%2011.93%200%200%201%208.48-3.54H140a8%208%200%200%201%200%2016h-28a12%2012%200%200%200%200%2024h32a12.2%2012.2%200%200%200%202.69-.3l67-15.41l.47-.12a4.61%204.61%200%200%201%205.82%204.44a4.58%204.58%200%200%201-2.3%204m-66.17-84.12a12%2012%200%200%201%2017-17L180%2075V24a12%2012%200%200%201%2024%200v51l11.51-11.52a12%2012%200%200%201%2017%2017l-32%2032a12%2012%200%200%201-17%200Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M232.76%20137.88a28.39%2028.39%200%200%200-24.63-4.88L172%20141.26V140a32%2032%200%200%200-32-32H89.94a35.76%2035.76%200%200%200-25.45%2010.54L43%20140H20a20%2020%200%200%200-20%2020v40a20%2020%200%200%200%2020%2020h100a12%2012%200%200%200%202.91-.36l64-16a11.4%2011.4%200%200%200%201.79-.6l38.82-16.54c.23-.09.45-.19.67-.3a28.61%2028.61%200%200%200%204.57-48.32M24%20164h12v32H24Zm193.68.61l-37.51%2016L118.52%20196H60v-39l21.46-21.46a11.93%2011.93%200%200%201%208.48-3.54H140a8%208%200%200%201%200%2016h-28a12%2012%200%200%200%200%2024h32a12.2%2012.2%200%200%200%202.69-.3l67-15.41l.47-.12a4.61%204.61%200%200%201%205.82%204.44a4.58%204.58%200%200%201-2.3%204m-66.17-84.12a12%2012%200%200%201%2017-17L180%2075V24a12%2012%200%200%201%2024%200v51l11.51-11.52a12%2012%200%200%201%2017%2017l-32%2032a12%2012%200%200%201-17%200Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/hand-arrow-down-bold.svg?color=%231a73e8&size=48