canned food emoji

canned-food from Twitter Emoji by Twitter · Default · Food & Drink · CC-BY-4.0 Attribution required.

Name
canned-food
Set
Twitter Emoji
Style
Default
Category
Food & Drink
Viewbox
36×36
License
CC BY 4.0

The same emoji in other sets

canned-foodFluent Emojicanned-foodFluent Emoji Flatcanned-foodFluent Emoji High Contrastcanned-foodNoto Emojicanned-foodOpenMoji

More food & drink icons from Twitter Emoji

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 36 36"><path fill="#99aab5" d="M30 32.5c0 1.933-5.373 3.5-12 3.5S6 34.433 6 32.5c0-1.932 5.372-3.5 12-3.5c6.627 0 12 1.567 12 3.5"/><path fill="#99aab5" d="M6 31.5h24v1H6z"/><path fill="#e6e7e8" d="M30 31.5c0 1.933-5.373 3.5-12 3.5S6 33.433 6 31.5S11.372 28 18 28c6.627 0 12 1.567 12 3.5"/><path fill="#5c913b" d="M29 31c0 1.656-4.926 3-11 3c-6.075 0-11-1.343-11-3s4.924-3 11-3s11 1.343 11 3"/><path fill="#5c913b" d="M7 8h22v23H7z"/><path fill="#a6d388" d="M29 23c0 1.932-4.926 3.5-11 3.5c-6.075 0-11-1.567-11-3.5s4.924-3.5 11-3.5c6.074 0 11 1.567 11 3.5"/><path fill="#a6d388" d="M7 10h22v13H7z"/><path fill="#5c913b" d="M29 14c0 1.932-4.926 3.5-11 3.5c-6.075 0-10.999-1.567-10.999-3.5S11.925 10.5 18 10.5c6.074 0 11 1.567 11 3.5"/><path fill="#5c913b" d="M7 4h22v10H7z"/><path fill="#99aab5" d="M30 4.5C30 6.433 24.627 8 18 8S6 6.433 6 4.5S11.373 1 18 1s12 1.567 12 3.5"/><path fill="#99aab5" d="M6 3.5h24v1H6z"/><path fill="#e6e7e8" d="M30 3.5C30 5.433 24.627 7 18 7S6 5.433 6 3.5S11.373 0 18 0s12 1.567 12 3.5"/><path fill="#ccd6dd" d="M28.25 3.5C28.25 4.881 23.662 6 18 6S7.75 4.881 7.75 3.5S12.338 1 18 1s10.25 1.119 10.25 2.5"/><path fill="#e6e7e8" d="M27.25 3.5c0 1.105-4.14 2-9.25 2s-9.25-.895-9.25-2s4.141-2 9.25-2c5.11 0 9.25.895 9.25 2"/><path fill="#ccd6dd" d="M24 3.5c0 .69-2.686 1.25-6 1.25s-6-.56-6-1.25s2.686-1.25 6-1.25s6 .56 6 1.25"/><ellipse cx="18" cy="3.5" fill="#e6e7e8" rx="4.75" ry=".75"/><path fill="#ffcc4d" d="M25 21c0 4.142-3.134 7.5-7 7.5s-7-3.358-7-7.5s3.134-7.5 7-7.5s7 3.358 7 7.5"/><path fill="#ffac33" d="M23 21c0 3.156-2.239 5.715-5 5.715s-5-2.56-5-5.715s2.238-5.714 5-5.714s5 2.558 5 5.714"/></svg>

React

import type { SVGProps } from "react";

export function TwemojiCannedFood(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#99aab5" d="M30 32.5c0 1.933-5.373 3.5-12 3.5S6 34.433 6 32.5c0-1.932 5.372-3.5 12-3.5c6.627 0 12 1.567 12 3.5"/><path fill="#99aab5" d="M6 31.5h24v1H6z"/><path fill="#e6e7e8" d="M30 31.5c0 1.933-5.373 3.5-12 3.5S6 33.433 6 31.5S11.372 28 18 28c6.627 0 12 1.567 12 3.5"/><path fill="#5c913b" d="M29 31c0 1.656-4.926 3-11 3c-6.075 0-11-1.343-11-3s4.924-3 11-3s11 1.343 11 3"/><path fill="#5c913b" d="M7 8h22v23H7z"/><path fill="#a6d388" d="M29 23c0 1.932-4.926 3.5-11 3.5c-6.075 0-11-1.567-11-3.5s4.924-3.5 11-3.5c6.074 0 11 1.567 11 3.5"/><path fill="#a6d388" d="M7 10h22v13H7z"/><path fill="#5c913b" d="M29 14c0 1.932-4.926 3.5-11 3.5c-6.075 0-10.999-1.567-10.999-3.5S11.925 10.5 18 10.5c6.074 0 11 1.567 11 3.5"/><path fill="#5c913b" d="M7 4h22v10H7z"/><path fill="#99aab5" d="M30 4.5C30 6.433 24.627 8 18 8S6 6.433 6 4.5S11.373 1 18 1s12 1.567 12 3.5"/><path fill="#99aab5" d="M6 3.5h24v1H6z"/><path fill="#e6e7e8" d="M30 3.5C30 5.433 24.627 7 18 7S6 5.433 6 3.5S11.373 0 18 0s12 1.567 12 3.5"/><path fill="#ccd6dd" d="M28.25 3.5C28.25 4.881 23.662 6 18 6S7.75 4.881 7.75 3.5S12.338 1 18 1s10.25 1.119 10.25 2.5"/><path fill="#e6e7e8" d="M27.25 3.5c0 1.105-4.14 2-9.25 2s-9.25-.895-9.25-2s4.141-2 9.25-2c5.11 0 9.25.895 9.25 2"/><path fill="#ccd6dd" d="M24 3.5c0 .69-2.686 1.25-6 1.25s-6-.56-6-1.25s2.686-1.25 6-1.25s6 .56 6 1.25"/><ellipse cx="18" cy="3.5" fill="#e6e7e8" rx="4.75" ry=".75"/><path fill="#ffcc4d" d="M25 21c0 4.142-3.134 7.5-7 7.5s-7-3.358-7-7.5s3.134-7.5 7-7.5s7 3.358 7 7.5"/><path fill="#ffac33" d="M23 21c0 3.156-2.239 5.715-5 5.715s-5-2.56-5-5.715s2.238-5.714 5-5.714s5 2.558 5 5.714"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#99aab5" d="M30 32.5c0 1.933-5.373 3.5-12 3.5S6 34.433 6 32.5c0-1.932 5.372-3.5 12-3.5c6.627 0 12 1.567 12 3.5"/><path fill="#99aab5" d="M6 31.5h24v1H6z"/><path fill="#e6e7e8" d="M30 31.5c0 1.933-5.373 3.5-12 3.5S6 33.433 6 31.5S11.372 28 18 28c6.627 0 12 1.567 12 3.5"/><path fill="#5c913b" d="M29 31c0 1.656-4.926 3-11 3c-6.075 0-11-1.343-11-3s4.924-3 11-3s11 1.343 11 3"/><path fill="#5c913b" d="M7 8h22v23H7z"/><path fill="#a6d388" d="M29 23c0 1.932-4.926 3.5-11 3.5c-6.075 0-11-1.567-11-3.5s4.924-3.5 11-3.5c6.074 0 11 1.567 11 3.5"/><path fill="#a6d388" d="M7 10h22v13H7z"/><path fill="#5c913b" d="M29 14c0 1.932-4.926 3.5-11 3.5c-6.075 0-10.999-1.567-10.999-3.5S11.925 10.5 18 10.5c6.074 0 11 1.567 11 3.5"/><path fill="#5c913b" d="M7 4h22v10H7z"/><path fill="#99aab5" d="M30 4.5C30 6.433 24.627 8 18 8S6 6.433 6 4.5S11.373 1 18 1s12 1.567 12 3.5"/><path fill="#99aab5" d="M6 3.5h24v1H6z"/><path fill="#e6e7e8" d="M30 3.5C30 5.433 24.627 7 18 7S6 5.433 6 3.5S11.373 0 18 0s12 1.567 12 3.5"/><path fill="#ccd6dd" d="M28.25 3.5C28.25 4.881 23.662 6 18 6S7.75 4.881 7.75 3.5S12.338 1 18 1s10.25 1.119 10.25 2.5"/><path fill="#e6e7e8" d="M27.25 3.5c0 1.105-4.14 2-9.25 2s-9.25-.895-9.25-2s4.141-2 9.25-2c5.11 0 9.25.895 9.25 2"/><path fill="#ccd6dd" d="M24 3.5c0 .69-2.686 1.25-6 1.25s-6-.56-6-1.25s2.686-1.25 6-1.25s6 .56 6 1.25"/><ellipse cx="18" cy="3.5" fill="#e6e7e8" rx="4.75" ry=".75"/><path fill="#ffcc4d" d="M25 21c0 4.142-3.134 7.5-7 7.5s-7-3.358-7-7.5s3.134-7.5 7-7.5s7 3.358 7 7.5"/><path fill="#ffac33" d="M23 21c0 3.156-2.239 5.715-5 5.715s-5-2.56-5-5.715s2.238-5.714 5-5.714s5 2.558 5 5.714"/></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%2036%2036%22%3E%3Cpath%20fill%3D%22%2399aab5%22%20d%3D%22M30%2032.5c0%201.933-5.373%203.5-12%203.5S6%2034.433%206%2032.5c0-1.932%205.372-3.5%2012-3.5c6.627%200%2012%201.567%2012%203.5%22%2F%3E%3Cpath%20fill%3D%22%2399aab5%22%20d%3D%22M6%2031.5h24v1H6z%22%2F%3E%3Cpath%20fill%3D%22%23e6e7e8%22%20d%3D%22M30%2031.5c0%201.933-5.373%203.5-12%203.5S6%2033.433%206%2031.5S11.372%2028%2018%2028c6.627%200%2012%201.567%2012%203.5%22%2F%3E%3Cpath%20fill%3D%22%235c913b%22%20d%3D%22M29%2031c0%201.656-4.926%203-11%203c-6.075%200-11-1.343-11-3s4.924-3%2011-3s11%201.343%2011%203%22%2F%3E%3Cpath%20fill%3D%22%235c913b%22%20d%3D%22M7%208h22v23H7z%22%2F%3E%3Cpath%20fill%3D%22%23a6d388%22%20d%3D%22M29%2023c0%201.932-4.926%203.5-11%203.5c-6.075%200-11-1.567-11-3.5s4.924-3.5%2011-3.5c6.074%200%2011%201.567%2011%203.5%22%2F%3E%3Cpath%20fill%3D%22%23a6d388%22%20d%3D%22M7%2010h22v13H7z%22%2F%3E%3Cpath%20fill%3D%22%235c913b%22%20d%3D%22M29%2014c0%201.932-4.926%203.5-11%203.5c-6.075%200-10.999-1.567-10.999-3.5S11.925%2010.5%2018%2010.5c6.074%200%2011%201.567%2011%203.5%22%2F%3E%3Cpath%20fill%3D%22%235c913b%22%20d%3D%22M7%204h22v10H7z%22%2F%3E%3Cpath%20fill%3D%22%2399aab5%22%20d%3D%22M30%204.5C30%206.433%2024.627%208%2018%208S6%206.433%206%204.5S11.373%201%2018%201s12%201.567%2012%203.5%22%2F%3E%3Cpath%20fill%3D%22%2399aab5%22%20d%3D%22M6%203.5h24v1H6z%22%2F%3E%3Cpath%20fill%3D%22%23e6e7e8%22%20d%3D%22M30%203.5C30%205.433%2024.627%207%2018%207S6%205.433%206%203.5S11.373%200%2018%200s12%201.567%2012%203.5%22%2F%3E%3Cpath%20fill%3D%22%23ccd6dd%22%20d%3D%22M28.25%203.5C28.25%204.881%2023.662%206%2018%206S7.75%204.881%207.75%203.5S12.338%201%2018%201s10.25%201.119%2010.25%202.5%22%2F%3E%3Cpath%20fill%3D%22%23e6e7e8%22%20d%3D%22M27.25%203.5c0%201.105-4.14%202-9.25%202s-9.25-.895-9.25-2s4.141-2%209.25-2c5.11%200%209.25.895%209.25%202%22%2F%3E%3Cpath%20fill%3D%22%23ccd6dd%22%20d%3D%22M24%203.5c0%20.69-2.686%201.25-6%201.25s-6-.56-6-1.25s2.686-1.25%206-1.25s6%20.56%206%201.25%22%2F%3E%3Cellipse%20cx%3D%2218%22%20cy%3D%223.5%22%20fill%3D%22%23e6e7e8%22%20rx%3D%224.75%22%20ry%3D%22.75%22%2F%3E%3Cpath%20fill%3D%22%23ffcc4d%22%20d%3D%22M25%2021c0%204.142-3.134%207.5-7%207.5s-7-3.358-7-7.5s3.134-7.5%207-7.5s7%203.358%207%207.5%22%2F%3E%3Cpath%20fill%3D%22%23ffac33%22%20d%3D%22M23%2021c0%203.156-2.239%205.715-5%205.715s-5-2.56-5-5.715s2.238-5.714%205-5.714s5%202.558%205%205.714%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%2036%2036%22%3E%3Cpath%20fill%3D%22%2399aab5%22%20d%3D%22M30%2032.5c0%201.933-5.373%203.5-12%203.5S6%2034.433%206%2032.5c0-1.932%205.372-3.5%2012-3.5c6.627%200%2012%201.567%2012%203.5%22%2F%3E%3Cpath%20fill%3D%22%2399aab5%22%20d%3D%22M6%2031.5h24v1H6z%22%2F%3E%3Cpath%20fill%3D%22%23e6e7e8%22%20d%3D%22M30%2031.5c0%201.933-5.373%203.5-12%203.5S6%2033.433%206%2031.5S11.372%2028%2018%2028c6.627%200%2012%201.567%2012%203.5%22%2F%3E%3Cpath%20fill%3D%22%235c913b%22%20d%3D%22M29%2031c0%201.656-4.926%203-11%203c-6.075%200-11-1.343-11-3s4.924-3%2011-3s11%201.343%2011%203%22%2F%3E%3Cpath%20fill%3D%22%235c913b%22%20d%3D%22M7%208h22v23H7z%22%2F%3E%3Cpath%20fill%3D%22%23a6d388%22%20d%3D%22M29%2023c0%201.932-4.926%203.5-11%203.5c-6.075%200-11-1.567-11-3.5s4.924-3.5%2011-3.5c6.074%200%2011%201.567%2011%203.5%22%2F%3E%3Cpath%20fill%3D%22%23a6d388%22%20d%3D%22M7%2010h22v13H7z%22%2F%3E%3Cpath%20fill%3D%22%235c913b%22%20d%3D%22M29%2014c0%201.932-4.926%203.5-11%203.5c-6.075%200-10.999-1.567-10.999-3.5S11.925%2010.5%2018%2010.5c6.074%200%2011%201.567%2011%203.5%22%2F%3E%3Cpath%20fill%3D%22%235c913b%22%20d%3D%22M7%204h22v10H7z%22%2F%3E%3Cpath%20fill%3D%22%2399aab5%22%20d%3D%22M30%204.5C30%206.433%2024.627%208%2018%208S6%206.433%206%204.5S11.373%201%2018%201s12%201.567%2012%203.5%22%2F%3E%3Cpath%20fill%3D%22%2399aab5%22%20d%3D%22M6%203.5h24v1H6z%22%2F%3E%3Cpath%20fill%3D%22%23e6e7e8%22%20d%3D%22M30%203.5C30%205.433%2024.627%207%2018%207S6%205.433%206%203.5S11.373%200%2018%200s12%201.567%2012%203.5%22%2F%3E%3Cpath%20fill%3D%22%23ccd6dd%22%20d%3D%22M28.25%203.5C28.25%204.881%2023.662%206%2018%206S7.75%204.881%207.75%203.5S12.338%201%2018%201s10.25%201.119%2010.25%202.5%22%2F%3E%3Cpath%20fill%3D%22%23e6e7e8%22%20d%3D%22M27.25%203.5c0%201.105-4.14%202-9.25%202s-9.25-.895-9.25-2s4.141-2%209.25-2c5.11%200%209.25.895%209.25%202%22%2F%3E%3Cpath%20fill%3D%22%23ccd6dd%22%20d%3D%22M24%203.5c0%20.69-2.686%201.25-6%201.25s-6-.56-6-1.25s2.686-1.25%206-1.25s6%20.56%206%201.25%22%2F%3E%3Cellipse%20cx%3D%2218%22%20cy%3D%223.5%22%20fill%3D%22%23e6e7e8%22%20rx%3D%224.75%22%20ry%3D%22.75%22%2F%3E%3Cpath%20fill%3D%22%23ffcc4d%22%20d%3D%22M25%2021c0%204.142-3.134%207.5-7%207.5s-7-3.358-7-7.5s3.134-7.5%207-7.5s7%203.358%207%207.5%22%2F%3E%3Cpath%20fill%3D%22%23ffac33%22%20d%3D%22M23%2021c0%203.156-2.239%205.715-5%205.715s-5-2.56-5-5.715s2.238-5.714%205-5.714s5%202.558%205%205.714%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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