Add icons to this collection by clicking the heart icon.
Coffee icon - also known as coffee, drinks, travel, hotel, vacation, holiday, traveling, tea time, and coffee break. Created in a clean outline color style with a white, silver, blue, and navy finish, 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"
x1="56"
x2="63"
y1="45"
y2="45"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#54a5ff" />
<stop offset="1" stop-color="#8ad3fe" />
</linearGradient>
<linearGradient id="b" x1=".92" x2="9.25" y1="14.16" y2="5.84" href="#a" />
<linearGradient
id="c"
x1="4"
x2="63"
y1="33.5"
y2="33.5"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#fe9661" />
<stop offset="1" stop-color="#ffb369" />
</linearGradient>
<g>
<path
fill="url(#a)"
d="M60 51h-3a1 1 0 0 1-1-1V40a1 1 0 0 1 1-1h3a3 3 0 0 1 3 3v6a3 3 0 0 1-3 3zm-2-2h2a1 1 0 0 0 1-1v-6a1 1 0 0 0-1-1h-2z"
/>
<path
fill="url(#b)"
d="M7 16H4a3 3 0 0 1-3-3V7a3 3 0 0 1 3-3h3a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1zM4 6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2V6z"
/>
<path fill="#ccd3eb" d="M29 4v23H7V4a2 2 0 0 1 2-2h18a2 2 0 0 1 2 2z" />
<path
fill="#f5f7ff"
d="M29 4v20H18.56A8.56 8.56 0 0 1 10 15.44V2h17a2 2 0 0 1 2 2z"
/>
<rect width="22" height="25" x="35" y="37" fill="#ccd3eb" rx="2" />
<path
fill="#f5f7ff"
d="M60 36v21a2 2 0 0 1-2 2H44.75A6.75 6.75 0 0 1 38 52.25V36a2 2 0 0 1 2-2h18a2 2 0 0 1 2 2z"
/>
<path
fill="#96a1c3"
d="M23 14a5 5 0 0 1-4.3 4.94 4 4 0 0 1-.7.06 5.09 5.09 0 0 1-1.3-.17 5 5 0 0 1 .6-9.77A4 4 0 0 1 18 9a5.09 5.09 0 0 1 1.3.17A5 5 0 0 1 23 14z"
/>
<path
fill="#9db8d3"
d="M18.94 14.66a5.28 5.28 0 0 1 .36 2 5.17 5.17 0 0 1-.36 2 3.36 3.36 0 0 0-.24 1.27 4 4 0 0 1-.7.07 5.09 5.09 0 0 1-1.3-.17 5.09 5.09 0 0 1 .36-1.83 3.39 3.39 0 0 0 .24-1.33 3.36 3.36 0 0 0-.24-1.33 5.23 5.23 0 0 1-.36-2 5.22 5.22 0 0 1 .36-2 3.32 3.32 0 0 0 .24-1.27A4 4 0 0 1 18 10a5.09 5.09 0 0 1 1.3.17 5.21 5.21 0 0 1-.36 1.83 3.34 3.34 0 0 0-.24 1.32 3.36 3.36 0 0 0 .24 1.34z"
/>
<path
fill="#0074ff"
d="m32 27-.62 2.49A2 2 0 0 1 29.44 31H6.56a2 2 0 0 1-1.94-1.51L4 27z"
/>
<path
fill="#b4cde1"
d="M48 44a1 1 0 0 1-1-1v-5a1 1 0 0 1 2 0v5a1 1 0 0 1-1 1z"
/>
<path fill="#0074ff" d="M51 43.88 48 43l-3 .88V50h6z" />
<path
fill="url(#c)"
d="M5 63a1 1 0 0 1-.71-.29 1 1 0 0 1 0-1.42l57-57a1 1 0 1 1 1.42 1.42l-57 57A1 1 0 0 1 5 63z"
/>
<g fill="#033c59">
<path
d="M29 13a1 1 0 0 0-1 1v1a1 1 0 0 0 2 0v-1a1 1 0 0 0-1-1zM60 39h-2a3 3 0 0 0-3-3H37a3 3 0 0 0-3 3v21a3 3 0 0 0 3 3h18a3 3 0 0 0 3-3v-9h2a3 3 0 0 0 3-3v-6a3 3 0 0 0-3-3zm-12 4.94 2 .58v4.38h-4v-4.38zM56 60a1 1 0 0 1-1 1H37a1 1 0 0 1-1-1V39a1 1 0 0 1 1-1h10v4a.7.7 0 0 0 0 .14l-2.31.67a1 1 0 0 0-.72 1v6.09a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1v-6.13a1 1 0 0 0-.72-1L49 42.14a.7.7 0 0 0 0-.14v-4h6a1 1 0 0 1 1 1zm5-12a1 1 0 0 1-1 1h-2v-8h2a1 1 0 0 1 1 1zM18.3 8H18a6 6 0 0 0-.4 12h.4a6 6 0 0 0 .4-12zM14 14a4 4 0 0 1 3.14-3.9c0 .07-.05.15-.08.23a5.22 5.22 0 0 0-.36 2 5.23 5.23 0 0 0 .36 2 3.36 3.36 0 0 1 .24 1.33 3.39 3.39 0 0 1-.24 1.34 6 6 0 0 0-.24.8A4 4 0 0 1 14 14zm8 0a4 4 0 0 1-3.14 3.9c0-.07.05-.15.08-.23a5.17 5.17 0 0 0 .36-2 5.28 5.28 0 0 0-.36-2 3.36 3.36 0 0 1-.24-1.33 3.34 3.34 0 0 1 .24-1.34 6.23 6.23 0 0 0 .24-.81A4 4 0 0 1 22 14z"
/>
<path
d="M6.56 32h22.88a3 3 0 0 0 2.91-2.27l.65-2.49a1 1 0 0 0-.18-.86A1 1 0 0 0 32 26h-2v-7a1 1 0 0 0-2 0v7H8V4a1 1 0 0 1 1-1h18a1 1 0 0 1 1 1v6a1 1 0 0 0 2 0V4a3 3 0 0 0-3-3H9a3 3 0 0 0-3 3H4a3 3 0 0 0-3 3v6a3 3 0 0 0 3 3h2v10H4a1 1 0 0 0-.79.38 1 1 0 0 0-.18.86l.62 2.49A3 3 0 0 0 6.56 32zM4 14a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h2v8zm3 14h23.72l-.31 1.24a1 1 0 0 1-1 .76H6.56a1 1 0 0 1-1-.76L5.28 28zM62.71 4.29a1 1 0 0 0-1.42 0l-57 57a1 1 0 0 0 0 1.42 1 1 0 0 0 1.42 0l57-57a1 1 0 0 0 0-1.42z"
/>
</g>
</g>
</svg>
More icons in the same style and category