Add icons to this collection by clicking the heart icon.
Coffee icon - also known as clock, coffee, coffee cup, mug, cafe, coffee break, 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="#fedbb8" />
<stop offset="1" stop-color="#c159dd" />
</linearGradient>
<linearGradient
id="b"
x1="29.009"
x2="29.009"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="c"
x1="41"
x2="41"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="d"
x1="17"
x2="17"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="e"
x1="27.629"
x2="27.629"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="f"
x1="29"
x2="29"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="g"
x1="47"
x2="47"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="h"
x1="43"
x2="43"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="i"
x1="42"
x2="42"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="j"
x1="19"
x2="19"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="k"
x1="45"
x2="45"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="l"
x1="46"
x2="46"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="m"
x1="39"
x2="39"
y1="64"
y2="0"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<path
fill="url(#b)"
d="M30.738 36.988c-.542 0-1.089.056-1.627.166-2.652.54-5.791 2.486-6.825 5.617-.84 2.544.332 5.023 2.786 5.895.692.246 1.437.37 2.214.37 2.168 0 4.512-.97 6.271-2.594 1.916-1.77 3.246-4.638 1.897-7.063-.859-1.519-2.578-2.391-4.716-2.391zm1.461 7.986c-1.835 1.695-4.547 2.485-6.458 1.808-1.431-.508-2.056-1.867-1.556-3.383.667-2.021 2.856-3.782 5.325-4.285.407-.083.82-.125 1.228-.125.821 0 2.298.179 2.971 1.37.935 1.679-.509 3.691-1.51 4.615z"
/>
<path
fill="url(#c)"
d="M41 51a1 1 0 0 0 1-1V32a1 1 0 1 0-2 0v18a1 1 0 0 0 1 1z"
/>
<path
fill="url(#d)"
d="M17 51a1 1 0 0 0 1-1V32a1 1 0 1 0-2 0v18a1 1 0 0 0 1 1z"
/>
<path
fill="url(#e)"
d="M26.258 20.217a.987.987 0 0 0 .405-.086l2.742-1.217a1 1 0 0 0-.812-1.828l-2.742 1.217a.999.999 0 0 0 .407 1.914z"
/>
<g fill="url(#f)">
<path
d="M29 27c4.878 0 9-4.121 9-9s-4.122-9-9-9-9 4.121-9 9 4.122 9 9 9zm0-16c3.794 0 7 3.206 7 7s-3.206 7-7 7-7-3.206-7-7 3.206-7 7-7zM34.71 38.46a1 1 0 0 0-1.377.321c-1.137 1.827-2.511 2.56-4.648 3.27-2.458.817-4.271 1.79-5.715 4.111a1 1 0 1 0 1.698 1.056c1.137-1.827 2.511-2.56 4.648-3.27 2.458-.817 4.271-1.79 5.715-4.111a1 1 0 0 0-.321-1.377z"
/>
<path
d="M29 19a1 1 0 0 0 1-1v-4a1 1 0 1 0-2 0v4a1 1 0 0 0 1 1zM17 33h24a1 1 0 1 0 0-2H17a1 1 0 1 0 0 2z"
/>
</g>
<path fill="url(#g)" d="M46 46a1 1 0 1 0 2 0v-8a1 1 0 1 0-2 0z" />
<path
fill="url(#h)"
d="M40 36a1 1 0 0 0 1 1h4a1 1 0 1 0 0-2h-4a1 1 0 0 0-1 1z"
/>
<path fill="url(#i)" d="M43 49h-2a1 1 0 1 0 0 2h2a1 1 0 1 0 0-2z" />
<path
fill="url(#j)"
d="M21 55a1 1 0 1 0 0-2c-1.654 0-3-1.346-3-3a1 1 0 1 0-2 0c0 2.757 2.243 5 5 5z"
/>
<path fill="url(#f)" d="M21 55h16a1 1 0 1 0 0-2H21a1 1 0 1 0 0 2z" />
<path
fill="url(#k)"
d="M43 51c2.757 0 5-2.243 5-5a1 1 0 1 0-2 0c0 1.654-1.346 3-3 3a1 1 0 1 0 0 2z"
/>
<path
fill="url(#l)"
d="M45 37c.551 0 1 .448 1 1a1 1 0 1 0 2 0c0-1.654-1.346-3-3-3a1 1 0 1 0 0 2z"
/>
<path
fill="url(#m)"
d="M37 55c2.757 0 5-2.243 5-5a1 1 0 1 0-2 0c0 1.654-1.346 3-3 3a1 1 0 1 0 0 2z"
/>
</svg>
More icons in the same style and category