middle finger icon

middle-finger from IconPark Outline by ByteDance · Outline · Hands · Apache-2.0 Free for personal and commercial use.

Name: middle-finger
Set: IconPark Outline
Style: Outline
Category: Hands
Viewbox: 48×48
License: Apache 2.0

The same icon in other sets

middle-fingerEmoji One (Colored)middle-fingerFluent Emoji middle-fingerFluent Emoji Flat middle-fingerFluent Emoji High Contrast middle-fingerIconPark middle-finger-fillMingCute Icon middle-fingerNoto Emoji middle-fingerOpenMoji middle-fingerTwitter Emoji

More hands icons from IconPark Outline

bad bad-one bad-two bless bye clap click-tap click-tap-two come concept-sharing cool delivery easy empty fingerprint fingerprint-three fingerprint-two first fist five five-five flirt four four-four

Use the middle finger icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="4"><path d="M14.972 26.975Q9.992 27.862 9.99 33c0 5.138 5.153 11 9.8 11h11.89c4.547 0 7.31-3.85 7.31-6.94V24.01a3 3 0 0 0-3-3h-.01A2.99 2.99 0 0 0 32.99 24"/><path d="M14.972 30.04v-9.027a3.003 3.003 0 0 1 3.002-3.003h.003a3.01 3.01 0 0 1 3.006 3.01v4.003"/><path stroke-linejoin="round" d="M20.983 24.008V7.015a3.016 3.016 0 0 1 6.031 0v16.993"/><path stroke-linejoin="round" d="M26.99 23.716v-2.713a3 3 0 0 1 6 0v3"/></g></svg>

React

import type { SVGProps } from "react";

export function IconParkOutlineMiddleFinger(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke="currentColor" strokeLinecap="round" strokeWidth="4"><path d="M14.972 26.975Q9.992 27.862 9.99 33c0 5.138 5.153 11 9.8 11h11.89c4.547 0 7.31-3.85 7.31-6.94V24.01a3 3 0 0 0-3-3h-.01A2.99 2.99 0 0 0 32.99 24"/><path d="M14.972 30.04v-9.027a3.003 3.003 0 0 1 3.002-3.003h.003a3.01 3.01 0 0 1 3.006 3.01v4.003"/><path strokeLinejoin="round" d="M20.983 24.008V7.015a3.016 3.016 0 0 1 6.031 0v16.993"/><path strokeLinejoin="round" d="M26.99 23.716v-2.713a3 3 0 0 1 6 0v3"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="4"><path d="M14.972 26.975Q9.992 27.862 9.99 33c0 5.138 5.153 11 9.8 11h11.89c4.547 0 7.31-3.85 7.31-6.94V24.01a3 3 0 0 0-3-3h-.01A2.99 2.99 0 0 0 32.99 24"/><path d="M14.972 30.04v-9.027a3.003 3.003 0 0 1 3.002-3.003h.003a3.01 3.01 0 0 1 3.006 3.01v4.003"/><path stroke-linejoin="round" d="M20.983 24.008V7.015a3.016 3.016 0 0 1 6.031 0v16.993"/><path stroke-linejoin="round" d="M26.99 23.716v-2.713a3 3 0 0 1 6 0v3"/></g></svg>
</template>

CSS

.icon-middle-finger {
  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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20d%3D%22M14.972%2026.975Q9.992%2027.862%209.99%2033c0%205.138%205.153%2011%209.8%2011h11.89c4.547%200%207.31-3.85%207.31-6.94V24.01a3%203%200%200%200-3-3h-.01A2.99%202.99%200%200%200%2032.99%2024%22%2F%3E%3Cpath%20d%3D%22M14.972%2030.04v-9.027a3.003%203.003%200%200%201%203.002-3.003h.003a3.01%203.01%200%200%201%203.006%203.01v4.003%22%2F%3E%3Cpath%20stroke-linejoin%3D%22round%22%20d%3D%22M20.983%2024.008V7.015a3.016%203.016%200%200%201%206.031%200v16.993%22%2F%3E%3Cpath%20stroke-linejoin%3D%22round%22%20d%3D%22M26.99%2023.716v-2.713a3%203%200%200%201%206%200v3%22%2F%3E%3C%2Fg%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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20d%3D%22M14.972%2026.975Q9.992%2027.862%209.99%2033c0%205.138%205.153%2011%209.8%2011h11.89c4.547%200%207.31-3.85%207.31-6.94V24.01a3%203%200%200%200-3-3h-.01A2.99%202.99%200%200%200%2032.99%2024%22%2F%3E%3Cpath%20d%3D%22M14.972%2030.04v-9.027a3.003%203.003%200%200%201%203.002-3.003h.003a3.01%203.01%200%200%201%203.006%203.01v4.003%22%2F%3E%3Cpath%20stroke-linejoin%3D%22round%22%20d%3D%22M20.983%2024.008V7.015a3.016%203.016%200%200%201%206.031%200v16.993%22%2F%3E%3Cpath%20stroke-linejoin%3D%22round%22%20d%3D%22M26.99%2023.716v-2.713a3%203%200%200%201%206%200v3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/icon-park-outline/middle-finger.svg?color=%231a73e8&size=48