cake icon
cake from Material Symbols Light by Google · Regular · Activities · Apache-2.0 Free for personal and commercial use.
- Name
- cake
- Set
- Material Symbols Light
- Style
- Regular
- Category
- Activities
- Viewbox
- 24×24
- License
- Apache 2.0
5 other variants in Material Symbols Light
The same icon in other sets
cakeAkar IconscakeBootstrap IconscakeBoxIcons v2cakeBoxIcons v2 SolidcakeDeviconcakeFont Awesome SolidcakeHeroIconscakeHuge IconscakeIconParkcakeIconPark OutlinecakeIconPark SolidcakeIconPark TwoTonecakeMaterial Line IconscakeLucidecakeMajesticonscakeMaterial Icon ThemecakeMaterial SymbolscakeMaterial Design Iconscake-fillMingCute IconcakeMyna UI IconscakeOpenMojicakePhosphorcakePixelarticonscake-fillRemix Icon
More activities icons from Material Symbols Light
Use the cake icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4.73 21q-.31 0-.52-.23T4 20.23v-4.153q0-.667.474-1.141t1.141-.474h12.77q.666 0 1.14.474T20 16.077v4.154q0 .31-.23.54t-.54.229zM6 13.462v-3.77q0-.666.475-1.14t1.14-.475H11.5V6.588q-.43-.28-.715-.638t-.285-.84q0-.3.112-.568t.334-.488L12 3l1.052 1.052q.225.225.337.491t.111.568q0 .481-.285.839q-.284.358-.715.638v1.489h3.885q.666 0 1.14.475T18 9.692v3.77z"/></svg>
React
import type { SVGProps } from "react";
export function MaterialSymbolsLightCake(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="M4.73 21q-.31 0-.52-.23T4 20.23v-4.153q0-.667.474-1.141t1.141-.474h12.77q.666 0 1.14.474T20 16.077v4.154q0 .31-.23.54t-.54.229zM6 13.462v-3.77q0-.666.475-1.14t1.14-.475H11.5V6.588q-.43-.28-.715-.638t-.285-.84q0-.3.112-.568t.334-.488L12 3l1.052 1.052q.225.225.337.491t.111.568q0 .481-.285.839q-.284.358-.715.638v1.489h3.885q.666 0 1.14.475T18 9.692v3.77z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4.73 21q-.31 0-.52-.23T4 20.23v-4.153q0-.667.474-1.141t1.141-.474h12.77q.666 0 1.14.474T20 16.077v4.154q0 .31-.23.54t-.54.229zM6 13.462v-3.77q0-.666.475-1.14t1.14-.475H11.5V6.588q-.43-.28-.715-.638t-.285-.84q0-.3.112-.568t.334-.488L12 3l1.052 1.052q.225.225.337.491t.111.568q0 .481-.285.839q-.284.358-.715.638v1.489h3.885q.666 0 1.14.475T18 9.692v3.77z"/></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%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M4.73%2021q-.31%200-.52-.23T4%2020.23v-4.153q0-.667.474-1.141t1.141-.474h12.77q.666%200%201.14.474T20%2016.077v4.154q0%20.31-.23.54t-.54.229zM6%2013.462v-3.77q0-.666.475-1.14t1.14-.475H11.5V6.588q-.43-.28-.715-.638t-.285-.84q0-.3.112-.568t.334-.488L12%203l1.052%201.052q.225.225.337.491t.111.568q0%20.481-.285.839q-.284.358-.715.638v1.489h3.885q.666%200%201.14.475T18%209.692v3.77z%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%22M4.73%2021q-.31%200-.52-.23T4%2020.23v-4.153q0-.667.474-1.141t1.141-.474h12.77q.666%200%201.14.474T20%2016.077v4.154q0%20.31-.23.54t-.54.229zM6%2013.462v-3.77q0-.666.475-1.14t1.14-.475H11.5V6.588q-.43-.28-.715-.638t-.285-.84q0-.3.112-.568t.334-.488L12%203l1.052%201.052q.225.225.337.491t.111.568q0%20.481-.285.839q-.284.358-.715.638v1.489h3.885q.666%200%201.14.475T18%209.692v3.77z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols-light/cake.svg?color=%231a73e8&size=48
