beer icon

beer from Font Awesome Solid by Dave Gandy · Solid · Beverage · CC-BY-4.0 Attribution required.

Name: beer
Set: Font Awesome Solid
Style: Solid
Category: Beverage
Viewbox: 640×640
License: CC BY 4.0

The same icon in other sets

beerBoxIcons v2 beerBoxIcons v2 Solid beerHuge Icons beerHumbleicons beerIconPark beerIconPark Outline beerIconPark Solid beerIconPark TwoTone beerIonIcons beerJam Icons beerLine Awesome beerMaterial Line Icons beerLucide beerMaterial Design Icons beer-fillRemix Icon beerTabler Icons beerTDesign Icons

More beverage icons from Font Awesome Solid

blender cocktail coffee flask glass-cheers glass-martini glass-martini-alt glass-whiskey mug-hot wine-glass wine-glass-alt beer-mug-empty

Use the beer icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M96 144c0-26.5 21.5-48 48-48h288c26.5 0 48 21.5 48 48v16h64c35.3 0 64 28.7 64 64v108.2c0 24.2-13.7 46.4-35.4 57.2L480 435.8V448c0 53-43 96-96 96H192c-53 0-96-43-96-96zm384 220.2l64-32V224h-64zM224 216c0-13.3-10.7-24-24-24s-24 10.7-24 24v208c0 13.3 10.7 24 24 24s24-10.7 24-24zm88 0c0-13.3-10.7-24-24-24s-24 10.7-24 24v208c0 13.3 10.7 24 24 24s24-10.7 24-24zm88 0c0-13.3-10.7-24-24-24s-24 10.7-24 24v208c0 13.3 10.7 24 24 24s24-10.7 24-24z"/></svg>

React

import type { SVGProps } from "react";

export function Fa7SolidBeer(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="M96 144c0-26.5 21.5-48 48-48h288c26.5 0 48 21.5 48 48v16h64c35.3 0 64 28.7 64 64v108.2c0 24.2-13.7 46.4-35.4 57.2L480 435.8V448c0 53-43 96-96 96H192c-53 0-96-43-96-96zm384 220.2l64-32V224h-64zM224 216c0-13.3-10.7-24-24-24s-24 10.7-24 24v208c0 13.3 10.7 24 24 24s24-10.7 24-24zm88 0c0-13.3-10.7-24-24-24s-24 10.7-24 24v208c0 13.3 10.7 24 24 24s24-10.7 24-24zm88 0c0-13.3-10.7-24-24-24s-24 10.7-24 24v208c0 13.3 10.7 24 24 24s24-10.7 24-24z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M96 144c0-26.5 21.5-48 48-48h288c26.5 0 48 21.5 48 48v16h64c35.3 0 64 28.7 64 64v108.2c0 24.2-13.7 46.4-35.4 57.2L480 435.8V448c0 53-43 96-96 96H192c-53 0-96-43-96-96zm384 220.2l64-32V224h-64zM224 216c0-13.3-10.7-24-24-24s-24 10.7-24 24v208c0 13.3 10.7 24 24 24s24-10.7 24-24zm88 0c0-13.3-10.7-24-24-24s-24 10.7-24 24v208c0 13.3 10.7 24 24 24s24-10.7 24-24zm88 0c0-13.3-10.7-24-24-24s-24 10.7-24 24v208c0 13.3 10.7 24 24 24s24-10.7 24-24z"/></svg>
</template>

CSS

.icon-beer {
  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%22M96%20144c0-26.5%2021.5-48%2048-48h288c26.5%200%2048%2021.5%2048%2048v16h64c35.3%200%2064%2028.7%2064%2064v108.2c0%2024.2-13.7%2046.4-35.4%2057.2L480%20435.8V448c0%2053-43%2096-96%2096H192c-53%200-96-43-96-96zm384%20220.2l64-32V224h-64zM224%20216c0-13.3-10.7-24-24-24s-24%2010.7-24%2024v208c0%2013.3%2010.7%2024%2024%2024s24-10.7%2024-24zm88%200c0-13.3-10.7-24-24-24s-24%2010.7-24%2024v208c0%2013.3%2010.7%2024%2024%2024s24-10.7%2024-24zm88%200c0-13.3-10.7-24-24-24s-24%2010.7-24%2024v208c0%2013.3%2010.7%2024%2024%2024s24-10.7%2024-24z%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%22M96%20144c0-26.5%2021.5-48%2048-48h288c26.5%200%2048%2021.5%2048%2048v16h64c35.3%200%2064%2028.7%2064%2064v108.2c0%2024.2-13.7%2046.4-35.4%2057.2L480%20435.8V448c0%2053-43%2096-96%2096H192c-53%200-96-43-96-96zm384%20220.2l64-32V224h-64zM224%20216c0-13.3-10.7-24-24-24s-24%2010.7-24%2024v208c0%2013.3%2010.7%2024%2024%2024s24-10.7%2024-24zm88%200c0-13.3-10.7-24-24-24s-24%2010.7-24%2024v208c0%2013.3%2010.7%2024%2024%2024s24-10.7%2024-24zm88%200c0-13.3-10.7-24-24-24s-24%2010.7-24%2024v208c0%2013.3%2010.7%2024%2024%2024s24-10.7%2024-24z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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