vine logo

vine from Font Awesome 6 Brands by Dave Gandy · Regular · CC-BY-4.0 Attribution required.

Name: vine
Set: Font Awesome 6 Brands
Style: Regular
Viewbox: 384×512
License: CC BY 4.0

The same logo in other sets

vineCoreUI Brands vineFont Awesome Brands vineHuge Icons vineJam Icons vineLine Awesome vineSVG Logos vineMaterial Design Icons vineWeb3 Icons vineWeb3 Icons Branded

Use the vine logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 384 512"><path fill="currentColor" d="M384 254.7v52.1c-18.4 4.2-36.9 6.1-52.1 6.1c-36.9 77.4-103 143.8-125.1 156.2c-14 7.9-27.1 8.4-42.7-.8C137 452 34.2 367.7 0 102.7h74.5C93.2 261.8 139 343.4 189.3 404.5c27.9-27.9 54.8-65.1 75.6-106.9c-49.8-25.3-80.1-80.9-80.1-145.6c0-65.6 37.7-115.1 102.2-115.1c114.9 0 106.2 127.9 81.6 181.5c0 0-46.4 9.2-63.5-20.5c3.4-11.3 8.2-30.8 8.2-48.5c0-31.3-11.3-46.6-28.4-46.6c-18.2 0-30.8 17.1-30.8 50c.1 79.2 59.4 118.7 129.9 101.9"/></svg>

React

import type { SVGProps } from "react";

export function Fa6BrandsVine(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 384 512"><path fill="currentColor" d="M384 254.7v52.1c-18.4 4.2-36.9 6.1-52.1 6.1c-36.9 77.4-103 143.8-125.1 156.2c-14 7.9-27.1 8.4-42.7-.8C137 452 34.2 367.7 0 102.7h74.5C93.2 261.8 139 343.4 189.3 404.5c27.9-27.9 54.8-65.1 75.6-106.9c-49.8-25.3-80.1-80.9-80.1-145.6c0-65.6 37.7-115.1 102.2-115.1c114.9 0 106.2 127.9 81.6 181.5c0 0-46.4 9.2-63.5-20.5c3.4-11.3 8.2-30.8 8.2-48.5c0-31.3-11.3-46.6-28.4-46.6c-18.2 0-30.8 17.1-30.8 50c.1 79.2 59.4 118.7 129.9 101.9"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 384 512"><path fill="currentColor" d="M384 254.7v52.1c-18.4 4.2-36.9 6.1-52.1 6.1c-36.9 77.4-103 143.8-125.1 156.2c-14 7.9-27.1 8.4-42.7-.8C137 452 34.2 367.7 0 102.7h74.5C93.2 261.8 139 343.4 189.3 404.5c27.9-27.9 54.8-65.1 75.6-106.9c-49.8-25.3-80.1-80.9-80.1-145.6c0-65.6 37.7-115.1 102.2-115.1c114.9 0 106.2 127.9 81.6 181.5c0 0-46.4 9.2-63.5-20.5c3.4-11.3 8.2-30.8 8.2-48.5c0-31.3-11.3-46.6-28.4-46.6c-18.2 0-30.8 17.1-30.8 50c.1 79.2 59.4 118.7 129.9 101.9"/></svg>
</template>

CSS

.icon-vine {
  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%20384%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M384%20254.7v52.1c-18.4%204.2-36.9%206.1-52.1%206.1c-36.9%2077.4-103%20143.8-125.1%20156.2c-14%207.9-27.1%208.4-42.7-.8C137%20452%2034.2%20367.7%200%20102.7h74.5C93.2%20261.8%20139%20343.4%20189.3%20404.5c27.9-27.9%2054.8-65.1%2075.6-106.9c-49.8-25.3-80.1-80.9-80.1-145.6c0-65.6%2037.7-115.1%20102.2-115.1c114.9%200%20106.2%20127.9%2081.6%20181.5c0%200-46.4%209.2-63.5-20.5c3.4-11.3%208.2-30.8%208.2-48.5c0-31.3-11.3-46.6-28.4-46.6c-18.2%200-30.8%2017.1-30.8%2050c.1%2079.2%2059.4%20118.7%20129.9%20101.9%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%20384%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M384%20254.7v52.1c-18.4%204.2-36.9%206.1-52.1%206.1c-36.9%2077.4-103%20143.8-125.1%20156.2c-14%207.9-27.1%208.4-42.7-.8C137%20452%2034.2%20367.7%200%20102.7h74.5C93.2%20261.8%20139%20343.4%20189.3%20404.5c27.9-27.9%2054.8-65.1%2075.6-106.9c-49.8-25.3-80.1-80.9-80.1-145.6c0-65.6%2037.7-115.1%20102.2-115.1c114.9%200%20106.2%20127.9%2081.6%20181.5c0%200-46.4%209.2-63.5-20.5c3.4-11.3%208.2-30.8%208.2-48.5c0-31.3-11.3-46.6-28.4-46.6c-18.2%200-30.8%2017.1-30.8%2050c.1%2079.2%2059.4%20118.7%20129.9%20101.9%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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