hook from Web3 Icons Branded by 0xa3k5 · Branded · MIT Free for personal and commercial use.

Name
hook
Set
Web3 Icons Branded
Style
Branded
Viewbox
24×24
License
MIT

1 other variant in Web3 Icons Branded

The same logo in other sets

Use the hook logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVG7ZXzIjRM)" d="M7.482 7.5c2.155 0 3.51 1.395 3.915 2.088l-3.213.693l.89-.693C7.037 8.134 4.35 9.97 4.35 11.883c0 1.534 1.278 2.529 1.854 2.835c-1.737-.243-2.889-1.422-3.006-1.8A3.6 3.6 0 0 1 3 11.883C3 9.732 4.786 7.5 7.482 7.5"/><path fill="url(#SVGfQGvDegm)" d="M16.517 16.5c-2.155 0-3.51-1.395-3.915-2.088l3.213-.693l-.89.693c2.038 1.454 4.724-.383 4.724-2.295c0-1.534-1.278-2.529-1.854-2.835c1.737.243 2.89 1.422 3.006 1.8c.095.306.198.68.198 1.035c0 2.156-1.786 4.383-4.482 4.383"/><path fill="url(#SVGGprAGi3h)" d="M6.407 14.893a3.92 3.92 0 0 1-3.24-1.62c.247 1.53 2.025 3.227 4.37 3.227c1.88 0 3.518-1.643 4.103-2.466l2.313-3.416c.432-.526 1.67-1.58 3.132-1.58s3.217 1.054 3.915 1.58c-.297-1.03-1.498-3.087-3.915-3.087s-4.063 1.71-4.59 2.565c-.877 1.188-2.713 3.65-3.046 3.938c-.414.36-.81.859-3.042.859"/><defs><linearGradient id="SVG7ZXzIjRM" x1="18.019" x2="15.702" y1="8.28" y2="17.43" gradientUnits="userSpaceOnUse"><stop stop-color="#68d869"/><stop offset=".8" stop-color="#c6f88a"/></linearGradient><linearGradient id="SVGfQGvDegm" x1="11.999" x2="16.093" y1="16.5" y2="7.344" gradientUnits="userSpaceOnUse"><stop stop-color="#1cd7ca"/><stop offset=".39" stop-color="#1bb8ca"/><stop offset="1" stop-color="#1cd7ca"/></linearGradient><linearGradient id="SVGGprAGi3h" x1="3.162" x2="18.84" y1="16.499" y2="2.716" gradientUnits="userSpaceOnUse"><stop stop-color="#adf160"/><stop offset=".65" stop-color="#17b6d7"/><stop offset=".92" stop-color="#0061a0"/></linearGradient></defs></g></svg>

React

import type { SVGProps } from "react";

export function TokenBrandedHook(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVG7ZXzIjRM)" d="M7.482 7.5c2.155 0 3.51 1.395 3.915 2.088l-3.213.693l.89-.693C7.037 8.134 4.35 9.97 4.35 11.883c0 1.534 1.278 2.529 1.854 2.835c-1.737-.243-2.889-1.422-3.006-1.8A3.6 3.6 0 0 1 3 11.883C3 9.732 4.786 7.5 7.482 7.5"/><path fill="url(#SVGfQGvDegm)" d="M16.517 16.5c-2.155 0-3.51-1.395-3.915-2.088l3.213-.693l-.89.693c2.038 1.454 4.724-.383 4.724-2.295c0-1.534-1.278-2.529-1.854-2.835c1.737.243 2.89 1.422 3.006 1.8c.095.306.198.68.198 1.035c0 2.156-1.786 4.383-4.482 4.383"/><path fill="url(#SVGGprAGi3h)" d="M6.407 14.893a3.92 3.92 0 0 1-3.24-1.62c.247 1.53 2.025 3.227 4.37 3.227c1.88 0 3.518-1.643 4.103-2.466l2.313-3.416c.432-.526 1.67-1.58 3.132-1.58s3.217 1.054 3.915 1.58c-.297-1.03-1.498-3.087-3.915-3.087s-4.063 1.71-4.59 2.565c-.877 1.188-2.713 3.65-3.046 3.938c-.414.36-.81.859-3.042.859"/><defs><linearGradient id="SVG7ZXzIjRM" x1="18.019" x2="15.702" y1="8.28" y2="17.43" gradientUnits="userSpaceOnUse"><stop stopColor="#68d869"/><stop offset=".8" stopColor="#c6f88a"/></linearGradient><linearGradient id="SVGfQGvDegm" x1="11.999" x2="16.093" y1="16.5" y2="7.344" gradientUnits="userSpaceOnUse"><stop stopColor="#1cd7ca"/><stop offset=".39" stopColor="#1bb8ca"/><stop offset="1" stopColor="#1cd7ca"/></linearGradient><linearGradient id="SVGGprAGi3h" x1="3.162" x2="18.84" y1="16.499" y2="2.716" gradientUnits="userSpaceOnUse"><stop stopColor="#adf160"/><stop offset=".65" stopColor="#17b6d7"/><stop offset=".92" stopColor="#0061a0"/></linearGradient></defs></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVG7ZXzIjRM)" d="M7.482 7.5c2.155 0 3.51 1.395 3.915 2.088l-3.213.693l.89-.693C7.037 8.134 4.35 9.97 4.35 11.883c0 1.534 1.278 2.529 1.854 2.835c-1.737-.243-2.889-1.422-3.006-1.8A3.6 3.6 0 0 1 3 11.883C3 9.732 4.786 7.5 7.482 7.5"/><path fill="url(#SVGfQGvDegm)" d="M16.517 16.5c-2.155 0-3.51-1.395-3.915-2.088l3.213-.693l-.89.693c2.038 1.454 4.724-.383 4.724-2.295c0-1.534-1.278-2.529-1.854-2.835c1.737.243 2.89 1.422 3.006 1.8c.095.306.198.68.198 1.035c0 2.156-1.786 4.383-4.482 4.383"/><path fill="url(#SVGGprAGi3h)" d="M6.407 14.893a3.92 3.92 0 0 1-3.24-1.62c.247 1.53 2.025 3.227 4.37 3.227c1.88 0 3.518-1.643 4.103-2.466l2.313-3.416c.432-.526 1.67-1.58 3.132-1.58s3.217 1.054 3.915 1.58c-.297-1.03-1.498-3.087-3.915-3.087s-4.063 1.71-4.59 2.565c-.877 1.188-2.713 3.65-3.046 3.938c-.414.36-.81.859-3.042.859"/><defs><linearGradient id="SVG7ZXzIjRM" x1="18.019" x2="15.702" y1="8.28" y2="17.43" gradientUnits="userSpaceOnUse"><stop stop-color="#68d869"/><stop offset=".8" stop-color="#c6f88a"/></linearGradient><linearGradient id="SVGfQGvDegm" x1="11.999" x2="16.093" y1="16.5" y2="7.344" gradientUnits="userSpaceOnUse"><stop stop-color="#1cd7ca"/><stop offset=".39" stop-color="#1bb8ca"/><stop offset="1" stop-color="#1cd7ca"/></linearGradient><linearGradient id="SVGGprAGi3h" x1="3.162" x2="18.84" y1="16.499" y2="2.716" gradientUnits="userSpaceOnUse"><stop stop-color="#adf160"/><stop offset=".65" stop-color="#17b6d7"/><stop offset=".92" stop-color="#0061a0"/></linearGradient></defs></g></svg>
</template>

CSS

.icon-hook {
  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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVG7ZXzIjRM)%22%20d%3D%22M7.482%207.5c2.155%200%203.51%201.395%203.915%202.088l-3.213.693l.89-.693C7.037%208.134%204.35%209.97%204.35%2011.883c0%201.534%201.278%202.529%201.854%202.835c-1.737-.243-2.889-1.422-3.006-1.8A3.6%203.6%200%200%201%203%2011.883C3%209.732%204.786%207.5%207.482%207.5%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGfQGvDegm)%22%20d%3D%22M16.517%2016.5c-2.155%200-3.51-1.395-3.915-2.088l3.213-.693l-.89.693c2.038%201.454%204.724-.383%204.724-2.295c0-1.534-1.278-2.529-1.854-2.835c1.737.243%202.89%201.422%203.006%201.8c.095.306.198.68.198%201.035c0%202.156-1.786%204.383-4.482%204.383%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGGprAGi3h)%22%20d%3D%22M6.407%2014.893a3.92%203.92%200%200%201-3.24-1.62c.247%201.53%202.025%203.227%204.37%203.227c1.88%200%203.518-1.643%204.103-2.466l2.313-3.416c.432-.526%201.67-1.58%203.132-1.58s3.217%201.054%203.915%201.58c-.297-1.03-1.498-3.087-3.915-3.087s-4.063%201.71-4.59%202.565c-.877%201.188-2.713%203.65-3.046%203.938c-.414.36-.81.859-3.042.859%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVG7ZXzIjRM%22%20x1%3D%2218.019%22%20x2%3D%2215.702%22%20y1%3D%228.28%22%20y2%3D%2217.43%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2368d869%22%2F%3E%3Cstop%20offset%3D%22.8%22%20stop-color%3D%22%23c6f88a%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGfQGvDegm%22%20x1%3D%2211.999%22%20x2%3D%2216.093%22%20y1%3D%2216.5%22%20y2%3D%227.344%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%231cd7ca%22%2F%3E%3Cstop%20offset%3D%22.39%22%20stop-color%3D%22%231bb8ca%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%231cd7ca%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGGprAGi3h%22%20x1%3D%223.162%22%20x2%3D%2218.84%22%20y1%3D%2216.499%22%20y2%3D%222.716%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23adf160%22%2F%3E%3Cstop%20offset%3D%22.65%22%20stop-color%3D%22%2317b6d7%22%2F%3E%3Cstop%20offset%3D%22.92%22%20stop-color%3D%22%230061a0%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVG7ZXzIjRM)%22%20d%3D%22M7.482%207.5c2.155%200%203.51%201.395%203.915%202.088l-3.213.693l.89-.693C7.037%208.134%204.35%209.97%204.35%2011.883c0%201.534%201.278%202.529%201.854%202.835c-1.737-.243-2.889-1.422-3.006-1.8A3.6%203.6%200%200%201%203%2011.883C3%209.732%204.786%207.5%207.482%207.5%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGfQGvDegm)%22%20d%3D%22M16.517%2016.5c-2.155%200-3.51-1.395-3.915-2.088l3.213-.693l-.89.693c2.038%201.454%204.724-.383%204.724-2.295c0-1.534-1.278-2.529-1.854-2.835c1.737.243%202.89%201.422%203.006%201.8c.095.306.198.68.198%201.035c0%202.156-1.786%204.383-4.482%204.383%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGGprAGi3h)%22%20d%3D%22M6.407%2014.893a3.92%203.92%200%200%201-3.24-1.62c.247%201.53%202.025%203.227%204.37%203.227c1.88%200%203.518-1.643%204.103-2.466l2.313-3.416c.432-.526%201.67-1.58%203.132-1.58s3.217%201.054%203.915%201.58c-.297-1.03-1.498-3.087-3.915-3.087s-4.063%201.71-4.59%202.565c-.877%201.188-2.713%203.65-3.046%203.938c-.414.36-.81.859-3.042.859%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVG7ZXzIjRM%22%20x1%3D%2218.019%22%20x2%3D%2215.702%22%20y1%3D%228.28%22%20y2%3D%2217.43%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2368d869%22%2F%3E%3Cstop%20offset%3D%22.8%22%20stop-color%3D%22%23c6f88a%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGfQGvDegm%22%20x1%3D%2211.999%22%20x2%3D%2216.093%22%20y1%3D%2216.5%22%20y2%3D%227.344%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%231cd7ca%22%2F%3E%3Cstop%20offset%3D%22.39%22%20stop-color%3D%22%231bb8ca%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%231cd7ca%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGGprAGi3h%22%20x1%3D%223.162%22%20x2%3D%2218.84%22%20y1%3D%2216.499%22%20y2%3D%222.716%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23adf160%22%2F%3E%3Cstop%20offset%3D%22.65%22%20stop-color%3D%22%2317b6d7%22%2F%3E%3Cstop%20offset%3D%22.92%22%20stop-color%3D%22%230061a0%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/token-branded/hook.svg?color=%231a73e8&size=48