Add icons to this collection by clicking the heart icon.
Cocoa icon - also known as cup, coffee, hot drink, xmas, mug, chocolate, cocoa, and food and restaurant. 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 64 64"
>
<linearGradient id="a">
<stop offset="0" stop-color="#f8664f" />
<stop offset=".5" stop-color="#fcbc04" />
<stop offset="1" stop-color="#aad61a" />
</linearGradient>
<linearGradient
id="b"
x1="21.035"
x2="21.035"
y1=".957"
y2="62.54"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="c"
x1="31.035"
x2="31.035"
y1=".957"
y2="62.54"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="d"
x1="41.256"
x2="41.256"
y1=".957"
y2="62.54"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="e"
x1="23.669"
x2="23.669"
y1=".957"
y2="62.54"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="f"
x1="32.025"
x2="32.025"
y1=".957"
y2="62.54"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="g"
x1="40.38"
x2="40.38"
y1=".957"
y2="62.54"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="h"
x1="36.412"
x2="36.412"
y1=".957"
y2="62.54"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="i"
x1="31.804"
x2="31.804"
y1=".957"
y2="62.54"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<path
fill="url(#b)"
d="M18.601 6.8c.672.896.889 1.715.646 2.436a3.04 3.04 0 0 0 .737 3.163 2.957 2.957 0 0 0 2.742.8 2.897 2.897 0 0 0 2.112-1.834c.576-1.565 1.156-4.706-1.439-8.165a5.914 5.914 0 0 1-.736-1.327C22.2.735 21.09 0 19.835 0c-1.104 0-2.1.568-2.663 1.52a3.012 3.012 0 0 0-.057 3.009c.393.716.892 1.48 1.486 2.271zm.292-4.261c.199-.337.551-.539.942-.539.431 0 .822.251.975.626.267.657.6 1.254.99 1.774 1.925 2.566 1.693 4.828 1.161 6.273a.907.907 0 0 1-.665.572c-.327.071-.662-.025-.932-.294-.274-.274-.357-.676-.223-1.076.32-.95.417-2.463-.941-4.275a17.352 17.352 0 0 1-1.331-2.032 1.024 1.024 0 0 1 .024-1.029z"
/>
<path
fill="url(#c)"
d="M28.601 6.8c.672.896.889 1.715.646 2.436a3.04 3.04 0 0 0 .737 3.163 2.957 2.957 0 0 0 2.742.8 2.897 2.897 0 0 0 2.112-1.834c.576-1.565 1.156-4.706-1.439-8.165a5.914 5.914 0 0 1-.736-1.327C32.2.735 31.09 0 29.835 0c-1.104 0-2.1.568-2.663 1.52a3.012 3.012 0 0 0-.057 3.009c.393.716.892 1.48 1.486 2.271zm.292-4.261c.199-.337.551-.539.942-.539.431 0 .822.251.975.626.267.657.6 1.254.99 1.774 1.925 2.566 1.693 4.828 1.161 6.273a.907.907 0 0 1-.665.572c-.328.071-.663-.025-.932-.294-.274-.274-.357-.676-.223-1.076.32-.95.417-2.463-.941-4.275a17.352 17.352 0 0 1-1.331-2.032 1.024 1.024 0 0 1 .024-1.029z"
/>
<path
fill="url(#d)"
d="M38.82 6.8c.672.895.889 1.715.646 2.437a3.041 3.041 0 0 0 .737 3.161 2.957 2.957 0 0 0 2.742.8 2.897 2.897 0 0 0 2.112-1.834c.576-1.565 1.156-4.706-1.438-8.165a5.93 5.93 0 0 1-.736-1.328C42.419.735 41.309 0 40.055 0a3.07 3.07 0 0 0-2.663 1.519 3.015 3.015 0 0 0-.056 3.009c.393.72.893 1.484 1.484 2.272zm.292-4.261c.2-.338.553-.539.943-.539.431 0 .823.252.976.626.269.659.601 1.256.989 1.774 1.925 2.565 1.694 4.827 1.161 6.273a.907.907 0 0 1-.665.572c-.328.071-.663-.025-.931-.294-.274-.274-.357-.676-.224-1.076.32-.951.417-2.465-.941-4.275a17.348 17.348 0 0 1-1.33-2.032 1.027 1.027 0 0 1 .022-1.029z"
/>
<path
fill="url(#e)"
d="M23.67 26.489c-2.318 0-4.134 1.357-4.134 3.089s1.815 3.089 4.134 3.089c2.317 0 4.133-1.357 4.133-3.089s-1.816-3.089-4.133-3.089zm0 4.178c-1.303 0-2.134-.645-2.134-1.089s.831-1.089 2.134-1.089c1.302 0 2.133.645 2.133 1.089s-.831 1.089-2.133 1.089z"
/>
<path
fill="url(#f)"
d="M32.025 29.622c-2.318 0-4.134 1.357-4.134 3.089s1.815 3.089 4.134 3.089c2.317 0 4.133-1.357 4.133-3.089s-1.815-3.089-4.133-3.089zm0 4.178c-1.303 0-2.134-.645-2.134-1.089s.831-1.089 2.134-1.089c1.302 0 2.133.645 2.133 1.089s-.831 1.089-2.133 1.089z"
/>
<path
fill="url(#g)"
d="M40.381 26.489c-2.318 0-4.134 1.357-4.134 3.089s1.815 3.089 4.134 3.089c2.317 0 4.133-1.357 4.133-3.089s-1.816-3.089-4.133-3.089zm0 4.178c-1.303 0-2.134-.645-2.134-1.089s.831-1.089 2.134-1.089c1.302 0 2.133.645 2.133 1.089s-.831 1.089-2.133 1.089z"
/>
<path
fill="url(#h)"
d="M14.093 55.689c0 4.66 7.779 8.311 17.711 8.311s17.711-3.651 17.711-8.311c0-.979-.351-2.387-1.895-3.836a19.39 19.39 0 0 0 3.787-11.057c.886-.008 1.784.142 2.198.699.983 1.327-.516 4.867-1.082 6.206-.184.44-.276.889-.276 1.334 0 1.312.743 2.502 1.942 3.109a3.477 3.477 0 0 0 2.864.111 3.485 3.485 0 0 0 1.976-2.09c.985-2.862 2.008-7.196 1.284-11.593-.753-4.489-4.897-6.006-8.88-5.963V26.93C51.432 20.24 42.83 15 31.85 15s-19.581 5.24-19.581 11.93v13.379c0 4.301 1.414 8.27 3.779 11.5-1.278 1.174-1.955 2.5-1.955 3.88zm33.422 0c0 2.985-6.452 6.311-15.711 6.311s-15.711-3.326-15.711-6.311c0-.913.569-1.712 1.217-2.328 3.578 3.969 8.741 6.484 14.494 6.484h.093c5.73 0 10.875-2.495 14.452-6.438.77.749 1.166 1.514 1.166 2.282zM58.339 38.9c.654 3.982-.293 7.97-1.202 10.613-.142.411-.44.727-.84.89a1.453 1.453 0 0 1-1.21-.045c-.511-.258-.841-.777-.841-1.322 0-.178.042-.374.12-.56 1.304-3.078 2.308-6.199.845-8.171-.745-1.006-2.017-1.502-3.779-1.499v-4.194c2.051-.011 6.262.446 6.907 4.288zm-17.135 1.167h-2.089a1.09 1.09 0 0 1-1.089-1.089v-.709c2.816-.553 5.328-1.476 7.399-2.681v9.54c0 .616-.443 1.155-.988 1.202a1.064 1.064 0 0 1-.875-.328 1.043 1.043 0 0 1-.314-.756v-3.133a2.047 2.047 0 0 0-2.044-2.046zM31.85 36.86c-6.886 0-12.843-2.253-15.727-5.518.318-4.641 7.358-8.504 15.681-8.504 8.381 0 15.466 3.917 15.69 8.602-2.916 3.213-8.827 5.42-15.644 5.42zm0-19.86c9.694 0 17.582 4.455 17.582 9.93 0 .738-.154 1.456-.426 2.149-1.854-4.78-8.736-8.241-17.202-8.241-8.402 0-15.243 3.409-17.158 8.134a5.834 5.834 0 0 1-.378-2.042C14.269 21.455 22.155 17 31.85 17zM14.269 32.238c3.156 3.952 9.754 6.622 17.581 6.622 1.439 0 2.834-.095 4.177-.266v.383a3.092 3.092 0 0 0 3.089 3.089l2.133.044v3.133c0 .834.326 1.612.899 2.17a3.048 3.048 0 0 0 2.459.907c1.581-.135 2.819-1.538 2.819-3.195V34.223a12.7 12.7 0 0 0 2.006-1.985v8.071c0 9.669-7.866 17.535-17.535 17.535h-.093c-9.669 0-17.535-7.866-17.535-17.535v-8.071z"
/>
<path
fill="url(#i)"
d="M23.786 51.174a.997.997 0 0 0 1.414 0l1.796-1.796h2.394l-2.471 2.471a.999.999 0 1 0 1.414 1.414l2.471-2.471v2.394l-1.796 1.796a.999.999 0 1 0 1.414 1.414l1.382-1.382 1.382 1.382a.997.997 0 0 0 1.414 0 .999.999 0 0 0 0-1.414l-1.796-1.796v-2.394l2.471 2.471a.997.997 0 0 0 1.414 0 .999.999 0 0 0 0-1.414l-2.471-2.471h2.395l1.796 1.796a.997.997 0 0 0 1.414 0 .999.999 0 0 0 0-1.414l-1.382-1.382 1.382-1.382a.999.999 0 1 0-1.414-1.414l-1.796 1.796h-2.395l2.471-2.471a.999.999 0 1 0-1.414-1.414l-2.471 2.471V43.57l1.796-1.796a.999.999 0 1 0-1.414-1.414l-1.382 1.382-1.382-1.382a.999.999 0 1 0-1.414 1.414l1.796 1.796v2.394l-2.471-2.471a.999.999 0 1 0-1.414 1.414l2.471 2.471h-2.394L25.2 45.582a.999.999 0 1 0-1.414 1.414l1.382 1.382-1.382 1.382a1 1 0 0 0 0 1.414z"
/>
</svg>
More icons in the same style and category