beer icon

beer from BoxIcons v2 Solid by Boxicons · Solid · MIT Free for personal and commercial use.

Name: beer
Set: BoxIcons v2 Solid
Style: Solid
Viewbox: 24×24
License: MIT

The same icon in other sets

beerBoxIcons v2 beerFont Awesome 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

Use the beer icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M20 6h-2V4a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v15c0 1.654 1.346 3 3 3h10c1.654 0 3-1.346 3-3v-1h2c1.103 0 2-.897 2-2V8c0-1.103-.897-2-2-2M8 17H6V7h2zm6 0h-2V7h2zm6-1h-2V8h2z"/></svg>

React

import type { SVGProps } from "react";

export function BxsBeer(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M20 6h-2V4a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v15c0 1.654 1.346 3 3 3h10c1.654 0 3-1.346 3-3v-1h2c1.103 0 2-.897 2-2V8c0-1.103-.897-2-2-2M8 17H6V7h2zm6 0h-2V7h2zm6-1h-2V8h2z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M20 6h-2V4a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v15c0 1.654 1.346 3 3 3h10c1.654 0 3-1.346 3-3v-1h2c1.103 0 2-.897 2-2V8c0-1.103-.897-2-2-2M8 17H6V7h2zm6 0h-2V7h2zm6-1h-2V8h2z"/></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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M20%206h-2V4a1%201%200%200%200-1-1H3a1%201%200%200%200-1%201v15c0%201.654%201.346%203%203%203h10c1.654%200%203-1.346%203-3v-1h2c1.103%200%202-.897%202-2V8c0-1.103-.897-2-2-2M8%2017H6V7h2zm6%200h-2V7h2zm6-1h-2V8h2z%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M20%206h-2V4a1%201%200%200%200-1-1H3a1%201%200%200%200-1%201v15c0%201.654%201.346%203%203%203h10c1.654%200%203-1.346%203-3v-1h2c1.103%200%202-.897%202-2V8c0-1.103-.897-2-2-2M8%2017H6V7h2zm6%200h-2V7h2zm6-1h-2V8h2z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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