Drink Margarita icon
Used for restaurant, product & calendar scenarios. Contains state variants. The Drink Margarita icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Drink Margarita icon in React
Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.
npm install @fluentui/react-icons
import { DrinkMargarita24Regular, DrinkMargarita24Filled } from "@fluentui/react-icons";
export function Example() {
return <DrinkMargarita24Regular aria-label="Drink Margarita" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_drink_margarita_24_regular.svg" width="24" height="24" alt="Drink Margarita"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19.8732 3.48991C20.2818 3.42182 20.5578 3.0354 20.4897 2.62682C20.4216 2.21824 20.0352 1.94223 19.6266 2.01032L13.6266 3.01032C13.3192 3.06155 13.0756 3.29748 13.0145 3.60303L12.735 5.00012H5.75C5.33579 5.00012 5 5.33591 5 5.75012V9.75012C5 11.4609 6.32189 12.863 8 12.9907V13.5001C8 15.4529 9.39935 17.0789 11.25 17.4299V20.5001H8.75C8.33579 20.5001 8 20.8359 8 21.2501C8 21.6643 8.33579 22.0001 8.75 22.0001H15.25C15.6642 22.0001 16 21.6643 16 21.2501C16 20.8359 15.6642 20.5001 15.25 20.5001H12.75V17.4299C14.6006 17.0789 16 15.4529 16 13.5001V12.9907C17.6781 12.863 19 11.4609 19 9.75012V5.75012C19 5.33591 18.6642 5.00012 18.25 5.00012H14.2648L14.3838 4.40481L19.8732 3.48991ZM17.5 8.00012H13.6648L13.9648 6.50012H17.5V8.00012ZM13.3648 9.50012H17.5V9.75012C17.5 10.7166 16.7165 11.5001 15.75 11.5001H15.25C14.8358 11.5001 14.5 11.8359 14.5 12.2501V13.5001C14.5 14.8808 13.3807 16.0001 12 16.0001C10.6193 16.0001 9.5 14.8808 9.5 13.5001V12.2501C9.5 11.8359 9.16421 11.5001 8.75 11.5001H8.25C7.2835 11.5001 6.5 10.7166 6.5 9.75012V9.50012H11.835L11.0145 13.603C10.9332 14.0092 11.1966 14.4043 11.6028 14.4856C12.009 14.5668 12.4041 14.3034 12.4853 13.8972L13.3648 9.50012ZM12.135 8.00012H6.5V6.50012H12.435L12.135 8.00012Z" fill="currentColor"/></svg>Use it from the SVG package
Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:
npm install @fluentui/svg-icons
import icon from "@fluentui/svg-icons/icons/drink_margarita_24_regular.svg";Details
| Name | Drink Margarita |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_drink_margarita_24_regular.svg |
| Filled file | ic_fluent_drink_margarita_24_filled.svg |
| React components | DrinkMargarita24Regular, DrinkMargarita24Filled |
| License | MIT (© Microsoft Corporation) |