Add icons to this collection by clicking the heart icon.
Cupcake icon - also known as food, cupcake, dessert, bakery, sweet, baked, muffin, food and restaurant, and birthday and party. Created in a clean gradient style, perfect for web, apps, and UI projects. Available in SVG and PNG, with multiple style variants.
<svg
xmlns="http://www.w3.org/2000/svg"
width="512"
height="512"
viewBox="0 0 512 512"
>
<radialGradient
id="d"
cx="13.118"
cy="259.894"
r="174.479"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#fffbe4" />
<stop offset=".554" stop-color="#fff9c1" />
<stop offset="1" stop-color="#fbf4af" />
</radialGradient>
<radialGradient
id="e"
cx="366.141"
cy="57.241"
r="380.325"
gradientTransform="matrix(0 1 -.656 0 403.67 -308.9)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#ecbe6b" />
<stop offset=".138" stop-color="#ecbc65" />
<stop offset=".322" stop-color="#eab554" />
<stop offset=".532" stop-color="#e8a938" />
<stop offset=".597" stop-color="#e7a52e" />
<stop offset="1" stop-color="#df751c" />
</radialGradient>
<linearGradient id="a">
<stop offset="0" stop-color="#c67d66" />
<stop offset=".177" stop-color="#c27860" />
<stop offset=".414" stop-color="#b6694f" />
<stop offset=".597" stop-color="#aa593d" />
<stop offset="1" stop-color="#8b572e" />
</linearGradient>
<radialGradient
id="f"
cx="246.248"
cy="117.179"
r="86.282"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<radialGradient
id="g"
cx="374.248"
cy="117.179"
r="86.282"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<radialGradient
id="h"
cx="425.448"
cy="206.779"
r="86.282"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<radialGradient
id="i"
cx="310.248"
cy="181.179"
r="86.282"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<radialGradient
id="j"
cx="195.048"
cy="206.779"
r="86.282"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient id="b">
<stop offset="0" stop-color="#fff9e2" />
<stop offset=".554" stop-color="#f6e7c6" />
<stop offset="1" stop-color="#f4d8a5" />
</linearGradient>
<radialGradient
id="k"
cx="22.193"
cy="-71.31"
r="330.876"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<radialGradient
id="l"
cx="99.62"
cy="-56.436"
r="251.942"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient id="c">
<stop offset="0" stop-color="#f9ef63" />
<stop offset=".16" stop-color="#f7ec5d" />
<stop offset=".375" stop-color="#f3e44c" />
<stop offset=".597" stop-color="#ecd833" />
<stop offset="1" stop-color="#e49824" />
</linearGradient>
<radialGradient
id="m"
cx="364.611"
cy="311.794"
r="350.584"
gradientTransform="matrix(-1 0 0 -.729 729.223 539.042)"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<radialGradient
id="n"
cx="497"
cy="321.518"
r="284.544"
gradientTransform="matrix(-.234 .972 -.566 -.136 794.988 -118.04)"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<radialGradient
id="o"
cx="224.247"
cy="273.659"
r="238.078"
gradientTransform="matrix(.114 .993 -.743 .086 401.928 27.479)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#fbf4af" />
<stop offset=".381" stop-color="#faf184" />
<stop offset=".65" stop-color="#f9ef63" />
<stop offset=".811" stop-color="#f8ec52" />
<stop offset="1" stop-color="#f6e738" />
</radialGradient>
<radialGradient
id="p"
cx="392.044"
cy="1078.417"
r="211.111"
gradientTransform="matrix(.931 0 0 .113 -111.68 320.346)"
gradientUnits="userSpaceOnUse"
>
<stop offset=".012" stop-color="#fff9c1" />
<stop offset=".17" stop-color="#ffface" />
<stop offset=".496" stop-color="#fffbe4" />
<stop offset=".888" stop-color="#fff" />
</radialGradient>
<path fill="url(#d)" d="m0 236.8 64 204.8h76.8L128 364.8l-51.2-128z" />
<path
fill="url(#e)"
d="M425.331 112.895C413.964 74.157 359.667 44.8 294.4 44.8s-119.563 29.357-130.931 68.095C119.478 136.708 89.6 183.265 89.6 236.8h409.6c0-53.535-29.878-100.092-73.869-123.905z"
/>
<circle cx="229.6" cy="105.2" r="19.2" fill="url(#f)" />
<circle cx="357.6" cy="105.2" r="19.2" fill="url(#g)" />
<circle cx="408.8" cy="194.8" r="19.2" fill="url(#h)" />
<circle cx="293.6" cy="169.2" r="19.2" fill="url(#i)" />
<circle cx="178.4" cy="194.8" r="19.2" fill="url(#j)" />
<path
fill="url(#k)"
d="M12.8 236.8h76.8c0-53.535 29.878-100.091 73.869-123.905h-76.8C42.678 136.708 12.8 183.265 12.8 236.8z"
/>
<path
fill="url(#l)"
d="M294.4 44.8h-76.8c-65.267 0-119.563 29.357-130.931 68.095h76.8C174.836 74.157 229.133 44.8 294.4 44.8z"
/>
<path fill="url(#m)" d="m76.8 236.8 64 204.8h153.6V236.8z" />
<path fill="url(#n)" d="M512 236.8H294.4v204.8H448z" />
<path fill="url(#o)" d="M358.4 441.6h-128l-25.6-204.8H384z" />
<path
fill="url(#p)"
d="M256 467.2c113.107 0 204.798-11.351 204.798-25.353H51.202c0 14.002 91.691 25.353 204.798 25.353z"
/>
</svg>
More icons in the same style and category