food icon

food-24-regular from Fluent UI System Icons by Microsoft Corporation · 24 Regular · MIT Free for personal and commercial use.

Name
food-24-regular
Set
Fluent UI System Icons
Style
24 Regular
Viewbox
24×24
License
MIT

11 other variants in Fluent UI System Icons

food-16-filledfood-16-regularfood-20-filledfood-20-regularfood-24-filledfood-28-filledfood-28-regularfood-32-filledfood-32-regularfood-48-filledfood-48-regular

The same icon in other sets

foodElement Plusfood-16Fluent UI System Color IconsfoodMaterial Design Icons

Related icons in Fluent UI System Icons

food-apple-20-filledfood-cake-12-filledfood-carrot-20-filledfood-chicken-leg-16-filledfood-egg-16-filledfood-fish-20-filledfood-grains-20-filledfood-pizza-20-filledfood-toast-16-filled

Use the food icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3.193 3.726A1.89 1.89 0 0 1 5.085 2c.45 0 .866.156 1.193.417A2 2 0 0 1 7.5 2c.46 0 .884.155 1.222.417A1.9 1.9 0 0 1 9.915 2c.976 0 1.807.737 1.892 1.726c.084.975.193 2.483.193 3.774a4.5 4.5 0 0 1-2.176 3.854c-.222.134-.28.3-.274.386c.127 1.934.45 6.952.45 7.757a2.5 2.5 0 0 1-5 0c0-.805.323-5.823.45-7.757c.005-.087-.052-.252-.274-.386A4.5 4.5 0 0 1 3 7.5c0-1.29.109-2.799.193-3.774M9.5 7.25a.75.75 0 0 1-1.5 0V4a.5.5 0 0 0-1 0v3.25a.75.75 0 0 1-1.5 0V3.915a.415.415 0 0 0-.415-.415a.393.393 0 0 0-.398.355C4.604 4.82 4.5 6.275 4.5 7.5c0 1.09.58 2.044 1.452 2.57c.545.33 1.047.96.995 1.768c-.13 1.98-.447 6.918-.447 7.66a1 1 0 1 0 2 0c0-.742-.317-5.68-.447-7.66c-.052-.808.45-1.438.995-1.768A3 3 0 0 0 10.5 7.5c0-1.224-.104-2.68-.187-3.645a.393.393 0 0 0-.398-.355a.415.415 0 0 0-.415.415zm3.5.5A5.75 5.75 0 0 1 18.75 2a.75.75 0 0 1 .75.75v8.5c0 .318.106 1.895.225 3.642l.005.083c.13 1.908.27 3.983.27 4.522a2.5 2.5 0 0 1-5 0c0-.514.128-2.611.252-4.534c.062-.971.125-1.912.172-2.61l.023-.353h-.697A1.75 1.75 0 0 1 13 10.25zm3.998 3.552l-.021.314a798 798 0 0 0-.229 3.444c-.126 1.96-.248 3.986-.248 4.437a1 1 0 1 0 2 0c0-.48-.138-2.526-.272-4.504l-.007-.104C18.108 13.23 18 11.627 18 11.25V3.566a4.25 4.25 0 0 0-3.5 4.184v2.5c0 .138.112.25.25.25h1.5a.75.75 0 0 1 .748.802"/></svg>

React

import type { SVGProps } from "react";

export function FluentFood24Regular(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="M3.193 3.726A1.89 1.89 0 0 1 5.085 2c.45 0 .866.156 1.193.417A2 2 0 0 1 7.5 2c.46 0 .884.155 1.222.417A1.9 1.9 0 0 1 9.915 2c.976 0 1.807.737 1.892 1.726c.084.975.193 2.483.193 3.774a4.5 4.5 0 0 1-2.176 3.854c-.222.134-.28.3-.274.386c.127 1.934.45 6.952.45 7.757a2.5 2.5 0 0 1-5 0c0-.805.323-5.823.45-7.757c.005-.087-.052-.252-.274-.386A4.5 4.5 0 0 1 3 7.5c0-1.29.109-2.799.193-3.774M9.5 7.25a.75.75 0 0 1-1.5 0V4a.5.5 0 0 0-1 0v3.25a.75.75 0 0 1-1.5 0V3.915a.415.415 0 0 0-.415-.415a.393.393 0 0 0-.398.355C4.604 4.82 4.5 6.275 4.5 7.5c0 1.09.58 2.044 1.452 2.57c.545.33 1.047.96.995 1.768c-.13 1.98-.447 6.918-.447 7.66a1 1 0 1 0 2 0c0-.742-.317-5.68-.447-7.66c-.052-.808.45-1.438.995-1.768A3 3 0 0 0 10.5 7.5c0-1.224-.104-2.68-.187-3.645a.393.393 0 0 0-.398-.355a.415.415 0 0 0-.415.415zm3.5.5A5.75 5.75 0 0 1 18.75 2a.75.75 0 0 1 .75.75v8.5c0 .318.106 1.895.225 3.642l.005.083c.13 1.908.27 3.983.27 4.522a2.5 2.5 0 0 1-5 0c0-.514.128-2.611.252-4.534c.062-.971.125-1.912.172-2.61l.023-.353h-.697A1.75 1.75 0 0 1 13 10.25zm3.998 3.552l-.021.314a798 798 0 0 0-.229 3.444c-.126 1.96-.248 3.986-.248 4.437a1 1 0 1 0 2 0c0-.48-.138-2.526-.272-4.504l-.007-.104C18.108 13.23 18 11.627 18 11.25V3.566a4.25 4.25 0 0 0-3.5 4.184v2.5c0 .138.112.25.25.25h1.5a.75.75 0 0 1 .748.802"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3.193 3.726A1.89 1.89 0 0 1 5.085 2c.45 0 .866.156 1.193.417A2 2 0 0 1 7.5 2c.46 0 .884.155 1.222.417A1.9 1.9 0 0 1 9.915 2c.976 0 1.807.737 1.892 1.726c.084.975.193 2.483.193 3.774a4.5 4.5 0 0 1-2.176 3.854c-.222.134-.28.3-.274.386c.127 1.934.45 6.952.45 7.757a2.5 2.5 0 0 1-5 0c0-.805.323-5.823.45-7.757c.005-.087-.052-.252-.274-.386A4.5 4.5 0 0 1 3 7.5c0-1.29.109-2.799.193-3.774M9.5 7.25a.75.75 0 0 1-1.5 0V4a.5.5 0 0 0-1 0v3.25a.75.75 0 0 1-1.5 0V3.915a.415.415 0 0 0-.415-.415a.393.393 0 0 0-.398.355C4.604 4.82 4.5 6.275 4.5 7.5c0 1.09.58 2.044 1.452 2.57c.545.33 1.047.96.995 1.768c-.13 1.98-.447 6.918-.447 7.66a1 1 0 1 0 2 0c0-.742-.317-5.68-.447-7.66c-.052-.808.45-1.438.995-1.768A3 3 0 0 0 10.5 7.5c0-1.224-.104-2.68-.187-3.645a.393.393 0 0 0-.398-.355a.415.415 0 0 0-.415.415zm3.5.5A5.75 5.75 0 0 1 18.75 2a.75.75 0 0 1 .75.75v8.5c0 .318.106 1.895.225 3.642l.005.083c.13 1.908.27 3.983.27 4.522a2.5 2.5 0 0 1-5 0c0-.514.128-2.611.252-4.534c.062-.971.125-1.912.172-2.61l.023-.353h-.697A1.75 1.75 0 0 1 13 10.25zm3.998 3.552l-.021.314a798 798 0 0 0-.229 3.444c-.126 1.96-.248 3.986-.248 4.437a1 1 0 1 0 2 0c0-.48-.138-2.526-.272-4.504l-.007-.104C18.108 13.23 18 11.627 18 11.25V3.566a4.25 4.25 0 0 0-3.5 4.184v2.5c0 .138.112.25.25.25h1.5a.75.75 0 0 1 .748.802"/></svg>
</template>

CSS

.icon-food-24-regular {
  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%22M3.193%203.726A1.89%201.89%200%200%201%205.085%202c.45%200%20.866.156%201.193.417A2%202%200%200%201%207.5%202c.46%200%20.884.155%201.222.417A1.9%201.9%200%200%201%209.915%202c.976%200%201.807.737%201.892%201.726c.084.975.193%202.483.193%203.774a4.5%204.5%200%200%201-2.176%203.854c-.222.134-.28.3-.274.386c.127%201.934.45%206.952.45%207.757a2.5%202.5%200%200%201-5%200c0-.805.323-5.823.45-7.757c.005-.087-.052-.252-.274-.386A4.5%204.5%200%200%201%203%207.5c0-1.29.109-2.799.193-3.774M9.5%207.25a.75.75%200%200%201-1.5%200V4a.5.5%200%200%200-1%200v3.25a.75.75%200%200%201-1.5%200V3.915a.415.415%200%200%200-.415-.415a.393.393%200%200%200-.398.355C4.604%204.82%204.5%206.275%204.5%207.5c0%201.09.58%202.044%201.452%202.57c.545.33%201.047.96.995%201.768c-.13%201.98-.447%206.918-.447%207.66a1%201%200%201%200%202%200c0-.742-.317-5.68-.447-7.66c-.052-.808.45-1.438.995-1.768A3%203%200%200%200%2010.5%207.5c0-1.224-.104-2.68-.187-3.645a.393.393%200%200%200-.398-.355a.415.415%200%200%200-.415.415zm3.5.5A5.75%205.75%200%200%201%2018.75%202a.75.75%200%200%201%20.75.75v8.5c0%20.318.106%201.895.225%203.642l.005.083c.13%201.908.27%203.983.27%204.522a2.5%202.5%200%200%201-5%200c0-.514.128-2.611.252-4.534c.062-.971.125-1.912.172-2.61l.023-.353h-.697A1.75%201.75%200%200%201%2013%2010.25zm3.998%203.552l-.021.314a798%20798%200%200%200-.229%203.444c-.126%201.96-.248%203.986-.248%204.437a1%201%200%201%200%202%200c0-.48-.138-2.526-.272-4.504l-.007-.104C18.108%2013.23%2018%2011.627%2018%2011.25V3.566a4.25%204.25%200%200%200-3.5%204.184v2.5c0%20.138.112.25.25.25h1.5a.75.75%200%200%201%20.748.802%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%22M3.193%203.726A1.89%201.89%200%200%201%205.085%202c.45%200%20.866.156%201.193.417A2%202%200%200%201%207.5%202c.46%200%20.884.155%201.222.417A1.9%201.9%200%200%201%209.915%202c.976%200%201.807.737%201.892%201.726c.084.975.193%202.483.193%203.774a4.5%204.5%200%200%201-2.176%203.854c-.222.134-.28.3-.274.386c.127%201.934.45%206.952.45%207.757a2.5%202.5%200%200%201-5%200c0-.805.323-5.823.45-7.757c.005-.087-.052-.252-.274-.386A4.5%204.5%200%200%201%203%207.5c0-1.29.109-2.799.193-3.774M9.5%207.25a.75.75%200%200%201-1.5%200V4a.5.5%200%200%200-1%200v3.25a.75.75%200%200%201-1.5%200V3.915a.415.415%200%200%200-.415-.415a.393.393%200%200%200-.398.355C4.604%204.82%204.5%206.275%204.5%207.5c0%201.09.58%202.044%201.452%202.57c.545.33%201.047.96.995%201.768c-.13%201.98-.447%206.918-.447%207.66a1%201%200%201%200%202%200c0-.742-.317-5.68-.447-7.66c-.052-.808.45-1.438.995-1.768A3%203%200%200%200%2010.5%207.5c0-1.224-.104-2.68-.187-3.645a.393.393%200%200%200-.398-.355a.415.415%200%200%200-.415.415zm3.5.5A5.75%205.75%200%200%201%2018.75%202a.75.75%200%200%201%20.75.75v8.5c0%20.318.106%201.895.225%203.642l.005.083c.13%201.908.27%203.983.27%204.522a2.5%202.5%200%200%201-5%200c0-.514.128-2.611.252-4.534c.062-.971.125-1.912.172-2.61l.023-.353h-.697A1.75%201.75%200%200%201%2013%2010.25zm3.998%203.552l-.021.314a798%20798%200%200%200-.229%203.444c-.126%201.96-.248%203.986-.248%204.437a1%201%200%201%200%202%200c0-.48-.138-2.526-.272-4.504l-.007-.104C18.108%2013.23%2018%2011.627%2018%2011.25V3.566a4.25%204.25%200%200%200-3.5%204.184v2.5c0%20.138.112.25.25.25h1.5a.75.75%200%200%201%20.748.802%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/food-24-regular.svg?color=%231a73e8&size=48