cocktail icon
cocktail from Font Awesome Solid by Dave Gandy · Solid · Beverage · CC-BY-4.0 Attribution required.
- Name
- cocktail
- Set
- Font Awesome Solid
- Style
- Solid
- Category
- Beverage
- Viewbox
- 640×640
- License
- CC BY 4.0
The same icon in other sets
More beverage icons from Font Awesome Solid
Use the cocktail icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M576 144c0-44.2-35.8-80-80-80c-18 0-34.6 6-48 16h-81c23.6-47.4 72.5-80 129-80c79.5 0 144 64.5 144 144s-64.5 144-144 144c-6.5 0-13-.4-19.3-1.3l64-74.7c1.1-1.3 2.2-2.7 3.3-4.1c19.4-14.6 32-37.8 32-64zm-509.1 2.6C72.2 135.3 83.5 128 96 128h384c12.5 0 23.8 7.3 29.1 18.6s3.4 24.7-4.8 34.2L320 395.8V512h64c17.7 0 32 14.3 32 32s-14.3 32-32 32H192c-17.7 0-32-14.3-32-32s14.3-32 32-32h64V395.8l-184.3-215c-8.1-9.5-10-22.8-4.8-34.2m98.7 45.4L288 334.8L410.4 192z"/></svg>
React
import type { SVGProps } from "react";
export function Fa7SolidCocktail(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M576 144c0-44.2-35.8-80-80-80c-18 0-34.6 6-48 16h-81c23.6-47.4 72.5-80 129-80c79.5 0 144 64.5 144 144s-64.5 144-144 144c-6.5 0-13-.4-19.3-1.3l64-74.7c1.1-1.3 2.2-2.7 3.3-4.1c19.4-14.6 32-37.8 32-64zm-509.1 2.6C72.2 135.3 83.5 128 96 128h384c12.5 0 23.8 7.3 29.1 18.6s3.4 24.7-4.8 34.2L320 395.8V512h64c17.7 0 32 14.3 32 32s-14.3 32-32 32H192c-17.7 0-32-14.3-32-32s14.3-32 32-32h64V395.8l-184.3-215c-8.1-9.5-10-22.8-4.8-34.2m98.7 45.4L288 334.8L410.4 192z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M576 144c0-44.2-35.8-80-80-80c-18 0-34.6 6-48 16h-81c23.6-47.4 72.5-80 129-80c79.5 0 144 64.5 144 144s-64.5 144-144 144c-6.5 0-13-.4-19.3-1.3l64-74.7c1.1-1.3 2.2-2.7 3.3-4.1c19.4-14.6 32-37.8 32-64zm-509.1 2.6C72.2 135.3 83.5 128 96 128h384c12.5 0 23.8 7.3 29.1 18.6s3.4 24.7-4.8 34.2L320 395.8V512h64c17.7 0 32 14.3 32 32s-14.3 32-32 32H192c-17.7 0-32-14.3-32-32s14.3-32 32-32h64V395.8l-184.3-215c-8.1-9.5-10-22.8-4.8-34.2m98.7 45.4L288 334.8L410.4 192z"/></svg> </template>
CSS
.icon-cocktail {
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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M576%20144c0-44.2-35.8-80-80-80c-18%200-34.6%206-48%2016h-81c23.6-47.4%2072.5-80%20129-80c79.5%200%20144%2064.5%20144%20144s-64.5%20144-144%20144c-6.5%200-13-.4-19.3-1.3l64-74.7c1.1-1.3%202.2-2.7%203.3-4.1c19.4-14.6%2032-37.8%2032-64zm-509.1%202.6C72.2%20135.3%2083.5%20128%2096%20128h384c12.5%200%2023.8%207.3%2029.1%2018.6s3.4%2024.7-4.8%2034.2L320%20395.8V512h64c17.7%200%2032%2014.3%2032%2032s-14.3%2032-32%2032H192c-17.7%200-32-14.3-32-32s14.3-32%2032-32h64V395.8l-184.3-215c-8.1-9.5-10-22.8-4.8-34.2m98.7%2045.4L288%20334.8L410.4%20192z%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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M576%20144c0-44.2-35.8-80-80-80c-18%200-34.6%206-48%2016h-81c23.6-47.4%2072.5-80%20129-80c79.5%200%20144%2064.5%20144%20144s-64.5%20144-144%20144c-6.5%200-13-.4-19.3-1.3l64-74.7c1.1-1.3%202.2-2.7%203.3-4.1c19.4-14.6%2032-37.8%2032-64zm-509.1%202.6C72.2%20135.3%2083.5%20128%2096%20128h384c12.5%200%2023.8%207.3%2029.1%2018.6s3.4%2024.7-4.8%2034.2L320%20395.8V512h64c17.7%200%2032%2014.3%2032%2032s-14.3%2032-32%2032H192c-17.7%200-32-14.3-32-32s14.3-32%2032-32h64V395.8l-184.3-215c-8.1-9.5-10-22.8-4.8-34.2m98.7%2045.4L288%20334.8L410.4%20192z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fa7-solid/cocktail.svg?color=%231a73e8&size=48
