Add icons to this collection by clicking the heart icon.
Hot Chocolate icon - also known as cup, hot drink, mug, cocoa, food and restaurant, and hot chocolate. 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 502 502"
>
<linearGradient id="a">
<stop offset="0" stop-color="#fbe7b4" />
<stop offset="1" stop-color="#fff5e3" />
</linearGradient>
<linearGradient
id="c"
x1="303.114"
x2="303.114"
y1="225.714"
y2="53.614"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="d"
x1="338.108"
x2="532.439"
y1="196.009"
y2="196.009"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient id="b">
<stop offset="0" stop-color="#bf6c56" />
<stop offset="1" stop-color="#ed9b8c" />
</linearGradient>
<linearGradient
id="e"
x1="302.996"
x2="302.996"
y1="51.513"
y2="11.88"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="f"
x1="391.899"
x2="391.899"
y1="135.37"
y2="95.737"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="g"
x1="236.945"
x2="236.945"
y1="289.727"
y2="102.291"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="h"
x1="0"
x2="175.297"
y1="339.483"
y2="339.483"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#fd869c" />
<stop offset="1" stop-color="#f7496e" />
</linearGradient>
<linearGradient
id="i"
x1="309.081"
x2="309.081"
y1="490.12"
y2="207.083"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#f7496e" />
<stop offset="1" stop-color="#fd869c" />
</linearGradient>
<linearGradient
id="j"
x1="215.542"
x2="215.542"
y1="134.578"
y2="96.529"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<path
fill="url(#c)"
d="m393.677 145.911-4.498-78.81c-1.388-24.325-22.233-42.919-46.559-41.531l-88.539 5.053c-24.325 1.388-42.919 22.233-41.531 46.559l4.498 78.81c1.388 24.325 22.233 42.919 46.559 41.531l88.539-5.054c24.326-1.388 42.92-22.233 41.531-46.558z"
/>
<path
fill="url(#d)"
d="m281.625 211.269 20.407-76.255c6.299-23.537 30.485-37.511 54.022-31.212l85.669 22.926c23.537 6.299 37.511 30.485 31.212 54.022l-20.407 76.255c-6.299 23.537-30.485 37.511-54.022 31.212l-85.669-22.926c-23.536-6.299-37.51-30.486-31.212-54.022z"
/>
<path
fill="url(#e)"
d="M317.997 14.977c-4.979-4.467-12.636-4.052-17.103.927l-13.826 15.41c-4.467 4.979-4.052 12.636.927 17.103 4.979 4.467 12.636 4.052 17.103-.927l13.826-15.41c4.466-4.979 4.052-12.636-.927-17.103z"
/>
<path
fill="url(#f)"
d="M406.9 98.833c-4.979-4.467-12.636-4.052-17.103.927l-13.826 15.41c-4.467 4.979-4.052 12.636.927 17.103 4.979 4.467 12.636 4.052 17.103-.927l13.826-15.41c4.467-4.978 4.052-12.636-.927-17.103z"
/>
<path
fill="url(#g)"
d="m332.599 211.269-20.407-76.255c-6.299-23.537-30.485-37.511-54.022-31.212l-85.669 22.926c-23.537 6.299-37.511 30.485-31.212 54.022l20.407 76.255c6.299 23.537 30.485 37.511 54.022 31.212l85.669-22.926c23.537-6.299 37.511-30.486 31.212-54.022z"
/>
<path
fill="#fddcb4"
d="M261.871 177.083h-93.21a82.11 82.11 0 0 0-27.121 4.602l7.785 29.09a52.324 52.324 0 0 1 19.336-3.692h93.21c8.284 0 15-6.716 15-15s-6.716-15-15-15zM296.168 77.242a73.633 73.633 0 0 0-26.565-4.952c-6.457 0-12.913.852-19.187 2.53l-37.428 10.016 1.746 30.589 43.438-11.624a43.875 43.875 0 0 1 26.988 1.35c6.918 2.622 14.714-.045 18.426-6.446 4.591-7.918 1.121-18.164-7.418-21.463z"
/>
<path
fill="url(#h)"
d="M149.76 431.837H92.354C41.43 431.837 0 390.407 0 339.483c0-50.925 41.43-92.355 92.354-92.355h57.406c14.103 0 25.537 11.433 25.537 25.537 0 14.103-11.433 25.537-25.537 25.537H92.354c-22.762 0-41.281 18.519-41.281 41.282 0 22.762 18.519 41.281 41.281 41.281h57.406c14.103 0 25.537 11.433 25.537 25.537 0 14.101-11.433 25.535-25.537 25.535z"
/>
<g fill="#f7496e">
<path
d="M149.76 380.764H92.354c-2.104 0-4.172-.16-6.193-.466v51.327a93.37 93.37 0 0 0 6.193.212h57.406c14.103 0 25.537-11.434 25.537-25.537 0-14.104-11.434-25.536-25.537-25.536zM149.76 247.129H92.354c-1.77 0-3.527.055-5.272.154a82.767 82.767 0 0 0-.921 12.301v39.084a41.47 41.47 0 0 1 6.193-.466h57.406c14.103 0 25.537-11.434 25.537-25.537s-11.434-25.536-25.537-25.536z"
/>
</g>
<path
fill="url(#i)"
d="M449.5 207.083H168.661c-28.995 0-52.5 23.505-52.5 52.5V437.62c0 28.995 23.505 52.5 52.5 52.5H449.5c28.995 0 52.5-23.505 52.5-52.5V259.583c0-28.995-23.505-52.5-52.5-52.5z"
/>
<ellipse cx="214.758" cy="352.24" fill="#fdaece" rx="16.03" ry="12.883" />
<ellipse cx="403.403" cy="352.24" fill="#fdaece" rx="16.03" ry="12.883" />
<circle cx="242.24" cy="320.453" r="31.787" fill="#fff" />
<circle cx="375.921" cy="320.453" r="31.787" fill="#fff" />
<g fill="#383842">
<circle cx="242.24" cy="320.453" r="18.945" />
<circle cx="375.921" cy="320.453" r="18.945" />
</g>
<path
fill="#383842"
d="M309.081 352.882c-5.544 0-11.086-2.096-15.609-6.289a5 5 0 1 1 6.799-7.333c5.187 4.809 12.433 4.809 17.62 0a5 5 0 0 1 6.799 7.333c-4.522 4.192-10.067 6.289-15.609 6.289z"
/>
<path
fill="#fddbe1"
d="M472 367.619c-5.523 0-10-4.478-10-10v-40.79c0-5.522 4.477-10 10-10s10 4.478 10 10v40.79c0 5.523-4.477 10-10 10zM472 291.464c-5.523 0-10-4.478-10-10v-7.881c0-5.522 4.477-10 10-10s10 4.478 10 10v7.881c0 5.523-4.477 10-10 10z"
/>
<path
fill="url(#j)"
d="m231.335 113.451-15.41-13.826c-4.979-4.467-12.636-4.052-17.103.926-4.467 4.979-4.052 12.636.927 17.103l15.41 13.826c4.979 4.467 12.636 4.052 17.103-.927 4.467-4.977 4.052-12.635-.927-17.102z"
/>
</svg>
More icons in the same style and category