Add icons to this collection by clicking the heart icon.
Latte icon - also known as cup, drink, coffee, beverage, hot, latte, and food and restaurant. Created in a clean outline 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 128 128"
>
<linearGradient
id="f"
x1="8"
x2="120"
y1="101.68"
y2="101.68"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#c0ccce" />
<stop offset="1" stop-color="#dce2e1" />
</linearGradient>
<linearGradient
id="a"
x1="63.978"
x2="63.978"
y1="101"
y2="111.116"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#b0c4cc" stop-opacity="0" />
<stop offset=".987" stop-color="#b0c4cc" />
</linearGradient>
<linearGradient
id="b"
x1="13.571"
x2="114.929"
y1="100.75"
y2="100.75"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#dce2e1" />
<stop offset="1" stop-color="#c0ccce" />
</linearGradient>
<linearGradient id="g" x1="64.25" x2="64.25" y2="93.5" href="#a" />
<linearGradient
id="c"
x1="113.929"
x2="57"
y1="100.597"
y2="100.597"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#92a6ad" stop-opacity="0" />
<stop offset=".987" stop-color="#92a6ad" />
</linearGradient>
<linearGradient
id="h"
x1="26.894"
x2="101.106"
y1="82.094"
y2="82.094"
href="#b"
/>
<linearGradient id="i" x1="64" x2="64" y1="83" y2="105.929" href="#c" />
<linearGradient
id="d"
x1="63.79"
x2="63.79"
y1="9.5"
y2="42.929"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#e9efee" />
<stop offset="1" stop-color="#ccd9db" />
</linearGradient>
<linearGradient
id="j"
x1="77.628"
x2="77.628"
y1="18.786"
y2="44.929"
href="#d"
/>
<linearGradient
id="k"
x1="50.728"
x2="50.728"
y1="18.786"
y2="44.929"
href="#d"
/>
<linearGradient
id="l"
x1="26.894"
x2="101.106"
y1="58.259"
y2="58.259"
href="#b"
/>
<linearGradient id="m" x1="64" x2="64" y1="56" y2="66.875" href="#c" />
<linearGradient
id="n"
x1="89.644"
x2="116.367"
y1="80.784"
y2="80.784"
href="#b"
/>
<linearGradient
id="o"
x1="98.764"
x2="94.907"
y1="90.475"
y2="89.939"
href="#c"
/>
<linearGradient
id="p"
x1="101.172"
x2="97.315"
y1="73.137"
y2="72.602"
href="#c"
/>
<linearGradient
id="q"
x1="98.764"
x2="98.764"
y1="89.962"
y2="96.224"
href="#c"
/>
<linearGradient
id="r"
x1="112.987"
x2="105.082"
y1="78.973"
y2="74.409"
href="#c"
/>
<linearGradient
id="s"
x1="32.902"
x2="95.031"
y1="62.038"
y2="62.038"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#c7463a" />
<stop offset="1" stop-color="#6d221b" />
</linearGradient>
<linearGradient
id="t"
x1="63.967"
x2="63.967"
y1="62"
y2="66.875"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#6d221b" stop-opacity="0" />
<stop offset=".641" stop-color="#6d221b" />
</linearGradient>
<linearGradient
id="e"
x1="63.784"
x2="63.784"
y1="8.5"
y2="43.929"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#2d2d2d" />
<stop offset=".987" stop-color="#141414" />
</linearGradient>
<linearGradient
id="u"
x1="77.621"
x2="77.621"
y1="17.785"
y2="45.929"
href="#e"
/>
<linearGradient
id="v"
x1="50.721"
x2="50.721"
y1="17.785"
y2="45.929"
href="#e"
/>
<linearGradient
id="w"
x1="63.997"
x2="63.997"
y1="61.747"
y2="65.125"
href="#e"
/>
<linearGradient id="x" x1="64" x2="64" y1="58.772" y2="62.674" href="#e" />
<linearGradient id="y" x1="64" x2="64" y1="48.643" y2="112.116" href="#e" />
<g>
<path
fill="url(#f)"
d="M103.193 93.433c10.365 1.821 16.799 4.386 16.807 7.248.015 5.653-25.044 10.324-55.972 10.433S8.016 106.729 8 101.076c-.01-3.698 10.712-6.976 26.787-8.831z"
/>
<path
fill="url(#a)"
d="M8.007 101c-.001.025-.007.05-.007.076.016 5.653 25.1 10.147 56.028 10.038 30.343-.107 55.02-4.606 55.929-10.114z"
/>
<ellipse cx="64.25" cy="100.75" fill="url(#b)" rx="50.679" ry="7.25" />
<path
fill="url(#g)"
d="M64.25 93.5c-27.989 0-50.679 3.246-50.679 7.25a1.1 1.1 0 0 0 .045.25h101.268a1.1 1.1 0 0 0 .045-.25c0-4.004-22.69-7.25-50.679-7.25z"
/>
<path
fill="url(#c)"
d="m57 105 33.793 1.835c13.92-1.293 23.136-3.534 23.136-6.085 0-2.764-10.817-5.167-26.723-6.39L57 96z"
/>
<path
fill="url(#h)"
d="M26.894 58.259c1.541 16.826 5.83 31.67 11.745 41.78 2.441 3.247 11.582 5.89 25.361 5.89s22.92-2.643 25.36-5.89c5.916-10.11 10.205-24.954 11.746-41.78z"
/>
<path
fill="url(#i)"
d="M31.522 83a78.181 78.181 0 0 0 7.117 17.04c2.441 3.246 11.582 5.888 25.361 5.888s22.92-2.642 25.36-5.888A78.176 78.176 0 0 0 96.479 83z"
/>
<path
fill="url(#d)"
d="M62.142 42.929a16.425 16.425 0 0 0-1.163-15.704c-5.143-8.143 4.101-16.01 5.74-17.725 0 0-3.184 5.786-2.005 11.464C65.688 25.656 68.142 26 68.142 32s-6 10.929-6 10.929z"
/>
<path
fill="url(#j)"
d="M76.339 44.929a12.845 12.845 0 0 0-.91-12.281c-4.022-6.368 3.207-12.522 4.488-13.862 0 0-2.49 4.524-1.567 8.965.761 3.67 2.68 3.939 2.68 8.63S76.34 44.93 76.34 44.93z"
/>
<path
fill="url(#k)"
d="M49.44 44.929a12.845 12.845 0 0 0-.91-12.281c-4.023-6.368 3.207-12.522 4.488-13.862 0 0-2.49 4.524-1.568 8.965.762 3.67 2.681 3.939 2.681 8.63S49.44 44.93 49.44 44.93z"
/>
<ellipse cx="64" cy="58.259" fill="url(#l)" rx="37.106" ry="8.616" />
<path
fill="url(#m)"
d="M26.894 58.259c0 4.758 16.613 8.616 37.106 8.616s37.106-3.858 37.106-8.616A3.09 3.09 0 0 0 99.808 56H28.192a3.09 3.09 0 0 0-1.298 2.259z"
/>
<path
fill="url(#n)"
d="M95.88 83.082c-.17 2.433.512 4.453 2.067 5.425 2.934 1.834 7.866-.763 11.014-5.8s3.322-10.607.387-12.442c-3.216-2.01-8.83 1.301-11.868 7.315l.833-7.788c3.559-3.03 9.753-6.77 15.423-2.571 6.12 4.532.72 17.61-7.552 24.234-5.17 4.142-11.53 4.927-16.54 4.745z"
/>
<path
fill="url(#o)"
d="M106.433 85.885c-2.877 2.847-6.257 4.015-8.487 2.621-1.554-.971-2.236-2.99-2.067-5.424L89.644 96.2c5.01.182 11.37-.602 16.54-4.744.556-.445 1.097-.921 1.624-1.42z"
/>
<path
fill="url(#p)"
d="M97.48 77.58a17.566 17.566 0 0 1 4.354-5.576l-1.296-3.91a25.57 25.57 0 0 0-2.225 1.698z"
/>
<path
fill="url(#q)"
d="M106.184 91.455a26.441 26.441 0 0 0 1.7-1.493L91.441 92.42 89.644 96.2c5.01.181 11.37-.603 16.54-4.745z"
/>
<path
fill="url(#r)"
d="m108.43 83.503.01-.006c4.01-3.182 6.122-4.99 5.15-10.265-.48-2.597-5.805-3.504-5.805-3.504a3.865 3.865 0 0 1 1.563.537c2.935 1.835 2.762 7.405-.386 12.442a18.9 18.9 0 0 1-.531.796z"
/>
<path
fill="url(#s)"
d="M32.902 62.957c6.621 2.358 18.072 3.918 31.098 3.918 12.982 0 24.4-1.55 31.03-3.894-3.178-3.306-15.877-5.78-31.075-5.78-15.161 0-27.835 2.461-31.053 5.756z"
/>
<path
fill="url(#t)"
d="M32.902 62.957c6.621 2.358 18.072 3.918 31.098 3.918 12.982 0 24.4-1.55 31.03-3.894A6.667 6.667 0 0 0 93.745 62H34.166a6.747 6.747 0 0 0-1.264.957z"
/>
</g>
<g>
<path
fill="url(#e)"
d="M61.257 42.465a1 1 0 0 0 1.52 1.237c.26-.214 6.365-5.303 6.365-11.702a13.02 13.02 0 0 0-1.876-7.245 13.136 13.136 0 0 1-1.573-3.994c-1.087-5.237 1.872-10.725 1.902-10.78a1 1 0 0 0-1.6-1.172c-.13.136-.311.313-.53.528-2.592 2.54-10.48 10.273-5.333 18.422a15.293 15.293 0 0 1 1.125 14.706zm2.776-28.639a16.648 16.648 0 0 0-.299 7.341 15.21 15.21 0 0 0 1.775 4.543A11.051 11.051 0 0 1 67.143 32a12.222 12.222 0 0 1-2.764 7.06 17.34 17.34 0 0 0-2.555-12.369c-2.941-4.657-.768-9.22 2.21-12.865z"
/>
<path
fill="url(#u)"
d="M75.453 44.465a1 1 0 0 0 1.52 1.237c.206-.17 5.058-4.214 5.058-9.32a10.365 10.365 0 0 0-1.494-5.77 10.08 10.08 0 0 1-1.208-3.064c-.833-4.013 1.441-8.24 1.464-8.282a1 1 0 0 0-1.6-1.171c-.1.105-.24.242-.41.407-2.057 2.018-8.319 8.158-4.2 14.68a11.752 11.752 0 0 1 .87 11.283zm1.945-21.402a12.665 12.665 0 0 0-.028 4.892 12.087 12.087 0 0 0 1.41 3.612 8.464 8.464 0 0 1 1.251 4.815 8.695 8.695 0 0 1-1.61 4.671 13.78 13.78 0 0 0-2.147-8.94c-2.032-3.217-.83-6.397 1.124-9.05z"
/>
<path
fill="url(#v)"
d="M48.554 44.465a1 1 0 0 0 1.52 1.237c.206-.17 5.057-4.214 5.057-9.32a10.365 10.365 0 0 0-1.494-5.77 10.08 10.08 0 0 1-1.208-3.064c-.833-4.013 1.442-8.24 1.465-8.282a1 1 0 0 0-1.6-1.171c-.102.105-.241.242-.41.408-2.058 2.017-8.32 8.157-4.201 14.679a11.751 11.751 0 0 1 .87 11.283zm1.945-21.402a12.668 12.668 0 0 0-.028 4.892 12.087 12.087 0 0 0 1.41 3.612 8.465 8.465 0 0 1 1.25 4.815 8.702 8.702 0 0 1-1.609 4.672 13.789 13.789 0 0 0-2.147-8.94c-2.032-3.217-.831-6.398 1.124-9.051z"
/>
<path
fill="url(#w)"
d="M77.583 63.6a.99.99 0 0 0 .331-1.35 1.01 1.01 0 0 0-1.357-.367c-.025.014-2.614 1.396-12.506 1.229-9.846.161-12.598-1.225-12.607-1.229a1 1 0 0 0-1.007 1.728c.278.162 2.872 1.515 12 1.514q.774 0 1.614-.013c10.481.168 13.252-1.34 13.532-1.513z"
/>
<path
fill="url(#x)"
d="M57.543 62.212a45.363 45.363 0 0 0 12.914 0 1 1 0 0 0-.299-1.977 47.155 47.155 0 0 1-4.835.416.999.999 0 0 0-.932-1.767l-.438.227-.437-.227a.998.998 0 0 0-.937 1.763 47.396 47.396 0 0 1-4.737-.412 1 1 0 0 0-.299 1.977z"
/>
<path
fill="url(#y)"
d="M105.869 92.92c.316-.225.638-.441.94-.684 6.134-4.913 10.672-13.204 10.556-19.288a7.936 7.936 0 0 0-3.034-6.53c-3.818-2.828-8.356-2.768-13.222.13.4-2.677.737-5.41.993-8.197 0-.009-.004-.016-.003-.025 0-.022.007-.044.007-.067 0-6.245-19.633-9.615-38.106-9.615s-38.105 3.37-38.105 9.615c0 .023.006.045.006.067 0 .009-.003.016-.003.025a119.58 119.58 0 0 0 7.466 33.057C22.934 92.686 6.985 95.545 7 101.078c.01 3.367 5.812 6.113 17.245 8.162 12.29 2.202 27.366 2.923 39.786 2.874 27.631-.097 56.988-4.138 56.969-11.436-.009-3.153-5.103-5.76-15.131-7.758zm7.273-24.895a5.94 5.94 0 0 1 2.223 4.96c.106 5.524-4.11 13.129-9.805 17.69a21.834 21.834 0 0 1-12.54 4.471q1.579-3.406 2.928-7.239a4.86 4.86 0 0 0 1.468 1.448 5.02 5.02 0 0 0 2.699.744c3.194 0 7.017-2.578 9.693-6.862 3.494-5.59 3.525-11.66.07-13.82-1.732-1.082-4.014-.982-6.425.288a14.085 14.085 0 0 0-3.312 2.487q.286-1.474.541-2.978c3.349-2.382 8.118-4.403 12.46-1.19zm-84.87-6.244c5.76 3.98 21.103 6.094 35.728 6.094s29.968-2.114 35.728-6.094a122.356 122.356 0 0 1-4.77 22.799l-.003.007a74.8 74.8 0 0 1-6.427 14.895c-2.11 2.718-10.487 5.447-24.528 5.447s-22.418-2.729-24.528-5.447c-5.524-9.465-9.454-22.747-11.2-37.701zm6.829.82c4.228-2.305 14.713-4.399 28.854-4.399 14.226 0 24.689 2.097 28.892 4.415C86.65 64.439 76.724 65.875 64 65.875c-12.76 0-22.705-1.444-28.9-3.274zm64.13 13.92a14.308 14.308 0 0 1 5.154-5.046c1.754-.924 3.33-1.053 4.434-.36 2.42 1.512 2.097 6.58-.706 11.064s-7.214 6.994-9.636 5.48a3.768 3.768 0 0 1-1.536-2.717q1.274-4.033 2.29-8.422zM64 50.643c22.317 0 36.037 4.414 36.102 7.593l-.02.199c-.166 1.073-1.84 2.273-4.843 3.392-4.091-3.374-16.512-5.625-31.284-5.625-14.695 0-27.147 2.244-31.26 5.6-2.962-1.111-4.612-2.302-4.777-3.367l-.02-.2c.065-3.178 13.785-7.592 36.102-7.592zm.023 59.47c-14.89.066-28.9-.956-39.425-2.842C13.092 105.21 9.004 102.644 9 101.073c-.006-2.3 7.878-5.683 25.165-7.747a66.474 66.474 0 0 0 3.611 7.218.965.965 0 0 0 .065.097c2.916 3.878 12.939 6.288 26.159 6.288s23.243-2.41 26.16-6.288a.965.965 0 0 0 .064-.097 61.364 61.364 0 0 0 1.808-3.352 26.12 26.12 0 0 0 11.306-2.715c11.537 2.061 15.658 4.625 15.662 6.207.01 3.857-20.9 9.31-54.977 9.43z"
/>
</g>
</svg>
More icons in the same style and category