A pint with a foamy head for bars, pubs and drink menus. On a 24×24 grid in stroke, two-tone, duotone and fill, free under MIT.
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5 9.828V19C5 20.657 6.3431 22 8 22H14C15.6569 22 17 20.657 17 19V18M5 9.828C3.8014 9.405 3 8.271 3 7C3 5.343 4.3431 4 6 4C6.742 4 7.4576 4.275 8.0087 4.772C8.128 3.208 9.4317 2 11 2C12.5683 2 13.872 3.208 13.9913 4.772C14.5424 4.275 15.258 4 16 4C17.6569 4 19 5.343 19 7C19 8.271 18.1986 9.405 17 9.828M5 9.828H17M17 18V12M17 18H18C19.6569 18 21 16.657 21 15C21 13.343 19.6569 12 18 12H17M17 9.828V12M9 14V18M13 14V18"/>
</svg>Also called
What someone searching for this drawing would have typed instead. These are the words the browser's search matches on.
- pint
- ale
- lager
- pub
- drink
- brewery
Related icons
The rest of the beer family first, then the Food & Drink shelf.
FAQ
Answered from beer's own facts: its shelf, the styles it was drawn in, its siblings and its dates.
- What is the beer icon for?
- A pint with a foamy head for bars, pubs and drink menus. It is filed under Food & Drink in Keyline Icons, drawn on the same 24×24 grid as the rest of the set. People look for it as pint, ale, lager, pub, drink and brewery, and the browser's search matches all of those.
- What styles does the beer icon come in?
- All four: stroke, two-tone, duotone and fill. They are drawn from the same geometry, so swapping style never moves anything.
- Is there a square or circle version of beer?
- No. beer is drawn as a bare glyph, and the set has no boxed variant of it.
- What other icons go with beer?
- banana, beef, bottle, bottle-wine, breakfast and burger-box-hot, and 12 more, all shown below. They are the Food & Drink shelf: nothing else in the set is named after beer.
- How do I import beer in React?
- <Beer /> is the component, and the style decides the module: stroke from "@keyline-icons/react", two-tone from "@keyline-icons/react/two-tone", duotone from "@keyline-icons/react/duotone" and fill from "@keyline-icons/react/fill". It takes the usual SVG props plus a size, so <Beer size={16} /> and className="size-4" both work, and there is no provider or theme to set up.
- Where is the beer SVG?
- icons/stroke/beer.svg, icons/two-tone/beer.svg, icons/duotone/beer.svg and icons/fill/beer.svg in the repository, normalised: no wrapper, no ids and no classes to strip out. The tabs above hand you the same drawing as SVG or JSX without the download, and neither needs an install.
- When was beer added to the set?
- Added 8 Nov 2026. It ships in v2.6.0, so an install at that version or later has it.
Questions about the set rather than about this drawing are answered where they belong. The home page covers what the set is, how the three styles differ, why some icons come boxed and where the Figma file is; installing the set in a shadcn/ui project covers the React package, the CLI and using an icon without React. The MIT licence is stated in the footer of every page.