cake icon
cake from TDesign Icons by TDesign · Outline · MIT Free for personal and commercial use.
- Name
- cake
- Set
- TDesign Icons
- Style
- Outline
- Viewbox
- 24×24
- License
- MIT
1 other variant in TDesign Icons
The same icon in other sets
cakeAkar IconscakeBootstrap IconscakeBoxIcons v2cakeBoxIcons v2 SolidcakeDeviconcakeFont Awesome SolidcakeHeroIconscakeHuge IconscakeIconParkcakeIconPark OutlinecakeIconPark SolidcakeIconPark TwoTonecakeMaterial Line IconscakeLucidecakeMajesticonscakeMaterial Icon ThemecakeMaterial SymbolscakeMaterial Symbols LightcakeMaterial Design Iconscake-fillMingCute IconcakeMyna UI IconscakeOpenMojicakePhosphorcakePixelarticons
Use the cake icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M4 11h16v10H4z"/><path d="M4 21h16v-5h-2l-3 1l-3-1l-3 1l-3-1H4z"/><path stroke="currentColor" stroke-linecap="square" stroke-width="2" d="M8 6v5m4-5v5m4-5v5M7.998 2.998h.004v.004h-.004zm4 0h.004v.004h-.004zm4 0h.004v.004h-.004zM2 21h20M4 16h2l3 1l3-1l3 1l3-1h2M4 11h16v10H4z"/></g></svg>
React
import type { SVGProps } from "react";
export function TdesignCake(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M4 11h16v10H4z"/><path d="M4 21h16v-5h-2l-3 1l-3-1l-3 1l-3-1H4z"/><path stroke="currentColor" strokeLinecap="square" strokeWidth="2" d="M8 6v5m4-5v5m4-5v5M7.998 2.998h.004v.004h-.004zm4 0h.004v.004h-.004zm4 0h.004v.004h-.004zM2 21h20M4 16h2l3 1l3-1l3 1l3-1h2M4 11h16v10H4z"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M4 11h16v10H4z"/><path d="M4 21h16v-5h-2l-3 1l-3-1l-3 1l-3-1H4z"/><path stroke="currentColor" stroke-linecap="square" stroke-width="2" d="M8 6v5m4-5v5m4-5v5M7.998 2.998h.004v.004h-.004zm4 0h.004v.004h-.004zm4 0h.004v.004h-.004zM2 21h20M4 16h2l3 1l3-1l3 1l3-1h2M4 11h16v10H4z"/></g></svg> </template>
CSS
.icon-cake {
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%3Cg%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M4%2011h16v10H4z%22%2F%3E%3Cpath%20d%3D%22M4%2021h16v-5h-2l-3%201l-3-1l-3%201l-3-1H4z%22%2F%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22square%22%20stroke-width%3D%222%22%20d%3D%22M8%206v5m4-5v5m4-5v5M7.998%202.998h.004v.004h-.004zm4%200h.004v.004h-.004zm4%200h.004v.004h-.004zM2%2021h20M4%2016h2l3%201l3-1l3%201l3-1h2M4%2011h16v10H4z%22%2F%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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M4%2011h16v10H4z%22%2F%3E%3Cpath%20d%3D%22M4%2021h16v-5h-2l-3%201l-3-1l-3%201l-3-1H4z%22%2F%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22square%22%20stroke-width%3D%222%22%20d%3D%22M8%206v5m4-5v5m4-5v5M7.998%202.998h.004v.004h-.004zm4%200h.004v.004h-.004zm4%200h.004v.004h-.004zM2%2021h20M4%2016h2l3%201l3-1l3%201l3-1h2M4%2011h16v10H4z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/tdesign/cake.svg?color=%231a73e8&size=48