first icon
first from IconPark Outline by ByteDance · Outline · Hands · Apache-2.0 Free for personal and commercial use.
- Name
- first
- Set
- IconPark Outline
- Style
- Outline
- Category
- Hands
- Viewbox
- 48×48
- License
- Apache 2.0
The same icon in other sets
More hands icons from IconPark Outline
Use the first 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-linejoin="round" stroke-width="4"><path d="M24.68 20.037c-1.115-.299-4.415-1.357-9.51 2.055c-3.031 2.03-4.306 5.148-4.736 7.438c-.204 1.089.72 1.967 1.82 1.836c.796-.094 1.68-.241 2.348-.467c1.97-.667 1.712-1.93 2.717-3.453s3.533-2.04 5.612-.885c2.08 1.154 2.747 3.125 2.299 4.797s-1.453 3.194-3.981 3.71c-2.528.518-3.343-.895-5.98-2.199c-1.374-.68-3.167.202-4.25.899a1.514 1.514 0 0 0-.609 1.822c.175.463.415 1.005.729 1.548c.816 1.413 4.378 5.95 8.985 6.588s9.404-1.66 12.12-5.114c2.717-3.452 2.797-8.209.907-12.299"/><path d="m33.046 26.42l-4.77-22.264c-.106-.5-.575-.845-1.069-.715c-1.161.307-2.636 1.077-2.705 2.87c-.09 2.305.364 20.038.97 23.256"/></g></svg>
React
import type { SVGProps } from "react";
export function IconParkOutlineFirst(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" strokeLinejoin="round" strokeWidth="4"><path d="M24.68 20.037c-1.115-.299-4.415-1.357-9.51 2.055c-3.031 2.03-4.306 5.148-4.736 7.438c-.204 1.089.72 1.967 1.82 1.836c.796-.094 1.68-.241 2.348-.467c1.97-.667 1.712-1.93 2.717-3.453s3.533-2.04 5.612-.885c2.08 1.154 2.747 3.125 2.299 4.797s-1.453 3.194-3.981 3.71c-2.528.518-3.343-.895-5.98-2.199c-1.374-.68-3.167.202-4.25.899a1.514 1.514 0 0 0-.609 1.822c.175.463.415 1.005.729 1.548c.816 1.413 4.378 5.95 8.985 6.588s9.404-1.66 12.12-5.114c2.717-3.452 2.797-8.209.907-12.299"/><path d="m33.046 26.42l-4.77-22.264c-.106-.5-.575-.845-1.069-.715c-1.161.307-2.636 1.077-2.705 2.87c-.09 2.305.364 20.038.97 23.256"/></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-linejoin="round" stroke-width="4"><path d="M24.68 20.037c-1.115-.299-4.415-1.357-9.51 2.055c-3.031 2.03-4.306 5.148-4.736 7.438c-.204 1.089.72 1.967 1.82 1.836c.796-.094 1.68-.241 2.348-.467c1.97-.667 1.712-1.93 2.717-3.453s3.533-2.04 5.612-.885c2.08 1.154 2.747 3.125 2.299 4.797s-1.453 3.194-3.981 3.71c-2.528.518-3.343-.895-5.98-2.199c-1.374-.68-3.167.202-4.25.899a1.514 1.514 0 0 0-.609 1.822c.175.463.415 1.005.729 1.548c.816 1.413 4.378 5.95 8.985 6.588s9.404-1.66 12.12-5.114c2.717-3.452 2.797-8.209.907-12.299"/><path d="m33.046 26.42l-4.77-22.264c-.106-.5-.575-.845-1.069-.715c-1.161.307-2.636 1.077-2.705 2.87c-.09 2.305.364 20.038.97 23.256"/></g></svg> </template>
CSS
.icon-first {
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-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20d%3D%22M24.68%2020.037c-1.115-.299-4.415-1.357-9.51%202.055c-3.031%202.03-4.306%205.148-4.736%207.438c-.204%201.089.72%201.967%201.82%201.836c.796-.094%201.68-.241%202.348-.467c1.97-.667%201.712-1.93%202.717-3.453s3.533-2.04%205.612-.885c2.08%201.154%202.747%203.125%202.299%204.797s-1.453%203.194-3.981%203.71c-2.528.518-3.343-.895-5.98-2.199c-1.374-.68-3.167.202-4.25.899a1.514%201.514%200%200%200-.609%201.822c.175.463.415%201.005.729%201.548c.816%201.413%204.378%205.95%208.985%206.588s9.404-1.66%2012.12-5.114c2.717-3.452%202.797-8.209.907-12.299%22%2F%3E%3Cpath%20d%3D%22m33.046%2026.42l-4.77-22.264c-.106-.5-.575-.845-1.069-.715c-1.161.307-2.636%201.077-2.705%202.87c-.09%202.305.364%2020.038.97%2023.256%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-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20d%3D%22M24.68%2020.037c-1.115-.299-4.415-1.357-9.51%202.055c-3.031%202.03-4.306%205.148-4.736%207.438c-.204%201.089.72%201.967%201.82%201.836c.796-.094%201.68-.241%202.348-.467c1.97-.667%201.712-1.93%202.717-3.453s3.533-2.04%205.612-.885c2.08%201.154%202.747%203.125%202.299%204.797s-1.453%203.194-3.981%203.71c-2.528.518-3.343-.895-5.98-2.199c-1.374-.68-3.167.202-4.25.899a1.514%201.514%200%200%200-.609%201.822c.175.463.415%201.005.729%201.548c.816%201.413%204.378%205.95%208.985%206.588s9.404-1.66%2012.12-5.114c2.717-3.452%202.797-8.209.907-12.299%22%2F%3E%3Cpath%20d%3D%22m33.046%2026.42l-4.77-22.264c-.106-.5-.575-.845-1.069-.715c-1.161.307-2.636%201.077-2.705%202.87c-.09%202.305.364%2020.038.97%2023.256%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/first.svg?color=%231a73e8&size=48
