canned food emoji

canned-food from Fluent Emoji High Contrast by Microsoft Corporation · Default · Food & Drink · MIT Free for personal and commercial use.

Name
canned-food
Set
Fluent Emoji High Contrast
Style
Default
Category
Food & Drink
Viewbox
32×32
License
MIT

The same emoji in other sets

canned-foodFluent Emojicanned-foodFluent Emoji Flatcanned-foodNoto Emojicanned-foodOpenMojicanned-foodTwitter Emoji

More food & drink icons from Fluent Emoji High Contrast

amphoraavocadobaby-bottlebaconbagelbaguette-breadbananabeansbeer-mugbell-pepperbento-boxbeverage-boxbirthday-cakeblueberriesbottle-with-popping-corkbowl-with-spoonbreadbroccolibrown-mushroombubble-teaburritobuttercandycarrot

Use the canned food emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><g fill="currentColor" clip-path="url(#SVGkRCCwb7V1)"><path d="M8 5.04h16v5.03h-2.239a7.98 7.98 0 0 0-5.771-2.46a7.98 7.98 0 0 0-5.771 2.46H8zm13.846 16.02H24v5.98H8v-5.98h2.134a7.98 7.98 0 0 0 5.856 2.55a7.98 7.98 0 0 0 5.856-2.55m-8.196-8.265a2.23 2.23 0 0 1-1.7-2.165h2.29c.71 0 1.344.333 1.752.852a2.23 2.23 0 0 1 1.768-.862h2.28a2.23 2.23 0 0 1-1.723 2.172a3.952 3.952 0 0 1-.757 7.828h-3.14c-2.18 0-3.95-1.77-3.95-3.95a3.954 3.954 0 0 1 3.18-3.875"/><path d="M3 3.52A3.52 3.52 0 0 1 6.52 0h18.3a3.52 3.52 0 0 1 2.17 6.292v19.5a3.53 3.53 0 0 1 1.35 2.778a3.52 3.52 0 0 1-3.52 3.52H6.52A3.52 3.52 0 0 1 3 28.57a3.54 3.54 0 0 1 2-3.185V6.696A3.52 3.52 0 0 1 3 3.52M24.82 2H6.52a1.52 1.52 0 1 0 0 3.04H7v22h-.48c-.84 0-1.52.69-1.52 1.53s.68 1.52 1.52 1.52h18.3c.84 0 1.52-.68 1.52-1.52c0-.78-.585-1.43-1.34-1.52V5.03A1.52 1.52 0 0 0 24.82 2"/></g><defs><clipPath id="SVGkRCCwb7V1"><path fill="#fff" d="M0 0h32v32H0z"/></clipPath></defs></g></svg>

React

import type { SVGProps } from "react";

export function FluentEmojiHighContrastCannedFood(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><g fill="currentColor" clipPath="url(#SVGkRCCwb7V1)"><path d="M8 5.04h16v5.03h-2.239a7.98 7.98 0 0 0-5.771-2.46a7.98 7.98 0 0 0-5.771 2.46H8zm13.846 16.02H24v5.98H8v-5.98h2.134a7.98 7.98 0 0 0 5.856 2.55a7.98 7.98 0 0 0 5.856-2.55m-8.196-8.265a2.23 2.23 0 0 1-1.7-2.165h2.29c.71 0 1.344.333 1.752.852a2.23 2.23 0 0 1 1.768-.862h2.28a2.23 2.23 0 0 1-1.723 2.172a3.952 3.952 0 0 1-.757 7.828h-3.14c-2.18 0-3.95-1.77-3.95-3.95a3.954 3.954 0 0 1 3.18-3.875"/><path d="M3 3.52A3.52 3.52 0 0 1 6.52 0h18.3a3.52 3.52 0 0 1 2.17 6.292v19.5a3.53 3.53 0 0 1 1.35 2.778a3.52 3.52 0 0 1-3.52 3.52H6.52A3.52 3.52 0 0 1 3 28.57a3.54 3.54 0 0 1 2-3.185V6.696A3.52 3.52 0 0 1 3 3.52M24.82 2H6.52a1.52 1.52 0 1 0 0 3.04H7v22h-.48c-.84 0-1.52.69-1.52 1.53s.68 1.52 1.52 1.52h18.3c.84 0 1.52-.68 1.52-1.52c0-.78-.585-1.43-1.34-1.52V5.03A1.52 1.52 0 0 0 24.82 2"/></g><defs><clipPath id="SVGkRCCwb7V1"><path fill="#fff" d="M0 0h32v32H0z"/></clipPath></defs></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><g fill="currentColor" clip-path="url(#SVGkRCCwb7V1)"><path d="M8 5.04h16v5.03h-2.239a7.98 7.98 0 0 0-5.771-2.46a7.98 7.98 0 0 0-5.771 2.46H8zm13.846 16.02H24v5.98H8v-5.98h2.134a7.98 7.98 0 0 0 5.856 2.55a7.98 7.98 0 0 0 5.856-2.55m-8.196-8.265a2.23 2.23 0 0 1-1.7-2.165h2.29c.71 0 1.344.333 1.752.852a2.23 2.23 0 0 1 1.768-.862h2.28a2.23 2.23 0 0 1-1.723 2.172a3.952 3.952 0 0 1-.757 7.828h-3.14c-2.18 0-3.95-1.77-3.95-3.95a3.954 3.954 0 0 1 3.18-3.875"/><path d="M3 3.52A3.52 3.52 0 0 1 6.52 0h18.3a3.52 3.52 0 0 1 2.17 6.292v19.5a3.53 3.53 0 0 1 1.35 2.778a3.52 3.52 0 0 1-3.52 3.52H6.52A3.52 3.52 0 0 1 3 28.57a3.54 3.54 0 0 1 2-3.185V6.696A3.52 3.52 0 0 1 3 3.52M24.82 2H6.52a1.52 1.52 0 1 0 0 3.04H7v22h-.48c-.84 0-1.52.69-1.52 1.53s.68 1.52 1.52 1.52h18.3c.84 0 1.52-.68 1.52-1.52c0-.78-.585-1.43-1.34-1.52V5.03A1.52 1.52 0 0 0 24.82 2"/></g><defs><clipPath id="SVGkRCCwb7V1"><path fill="#fff" d="M0 0h32v32H0z"/></clipPath></defs></g></svg>
</template>

CSS

.icon-canned-food {
  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%2032%2032%22%3E%3Cg%20fill%3D%22none%22%3E%3Cg%20fill%3D%22currentColor%22%20clip-path%3D%22url(%23SVGkRCCwb7V1)%22%3E%3Cpath%20d%3D%22M8%205.04h16v5.03h-2.239a7.98%207.98%200%200%200-5.771-2.46a7.98%207.98%200%200%200-5.771%202.46H8zm13.846%2016.02H24v5.98H8v-5.98h2.134a7.98%207.98%200%200%200%205.856%202.55a7.98%207.98%200%200%200%205.856-2.55m-8.196-8.265a2.23%202.23%200%200%201-1.7-2.165h2.29c.71%200%201.344.333%201.752.852a2.23%202.23%200%200%201%201.768-.862h2.28a2.23%202.23%200%200%201-1.723%202.172a3.952%203.952%200%200%201-.757%207.828h-3.14c-2.18%200-3.95-1.77-3.95-3.95a3.954%203.954%200%200%201%203.18-3.875%22%2F%3E%3Cpath%20d%3D%22M3%203.52A3.52%203.52%200%200%201%206.52%200h18.3a3.52%203.52%200%200%201%202.17%206.292v19.5a3.53%203.53%200%200%201%201.35%202.778a3.52%203.52%200%200%201-3.52%203.52H6.52A3.52%203.52%200%200%201%203%2028.57a3.54%203.54%200%200%201%202-3.185V6.696A3.52%203.52%200%200%201%203%203.52M24.82%202H6.52a1.52%201.52%200%201%200%200%203.04H7v22h-.48c-.84%200-1.52.69-1.52%201.53s.68%201.52%201.52%201.52h18.3c.84%200%201.52-.68%201.52-1.52c0-.78-.585-1.43-1.34-1.52V5.03A1.52%201.52%200%200%200%2024.82%202%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGkRCCwb7V1%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M0%200h32v32H0z%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fg%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%2032%2032%22%3E%3Cg%20fill%3D%22none%22%3E%3Cg%20fill%3D%22currentColor%22%20clip-path%3D%22url(%23SVGkRCCwb7V1)%22%3E%3Cpath%20d%3D%22M8%205.04h16v5.03h-2.239a7.98%207.98%200%200%200-5.771-2.46a7.98%207.98%200%200%200-5.771%202.46H8zm13.846%2016.02H24v5.98H8v-5.98h2.134a7.98%207.98%200%200%200%205.856%202.55a7.98%207.98%200%200%200%205.856-2.55m-8.196-8.265a2.23%202.23%200%200%201-1.7-2.165h2.29c.71%200%201.344.333%201.752.852a2.23%202.23%200%200%201%201.768-.862h2.28a2.23%202.23%200%200%201-1.723%202.172a3.952%203.952%200%200%201-.757%207.828h-3.14c-2.18%200-3.95-1.77-3.95-3.95a3.954%203.954%200%200%201%203.18-3.875%22%2F%3E%3Cpath%20d%3D%22M3%203.52A3.52%203.52%200%200%201%206.52%200h18.3a3.52%203.52%200%200%201%202.17%206.292v19.5a3.53%203.53%200%200%201%201.35%202.778a3.52%203.52%200%200%201-3.52%203.52H6.52A3.52%203.52%200%200%201%203%2028.57a3.54%203.54%200%200%201%202-3.185V6.696A3.52%203.52%200%200%201%203%203.52M24.82%202H6.52a1.52%201.52%200%201%200%200%203.04H7v22h-.48c-.84%200-1.52.69-1.52%201.53s.68%201.52%201.52%201.52h18.3c.84%200%201.52-.68%201.52-1.52c0-.78-.585-1.43-1.34-1.52V5.03A1.52%201.52%200%200%200%2024.82%202%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGkRCCwb7V1%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M0%200h32v32H0z%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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