Add icons to this collection by clicking the heart icon.
Video Player icon - also known as online, film, movie, video player, play button, streaming, and music and multimedia. Created in a clean flat 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 52 52"
>
<linearGradient id="a">
<stop offset="0" stop-color="#4c5c75" />
<stop offset="1" stop-color="#1d2943" />
</linearGradient>
<linearGradient
id="h"
x1="26"
x2="26"
y1="41.648"
y2="47.206"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="i"
x1="29.405"
x2="26.999"
y1="44.077"
y2="38.807"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#4c5c75" stop-opacity="0" />
<stop offset="1" stop-color="#1d2943" />
</linearGradient>
<linearGradient
id="j"
x1="31.793"
x2="13.517"
y1="34.787"
y2="-6.416"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="k"
x1="26"
x2="26"
y1="34.1"
y2="38.568"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#4c5c75" stop-opacity="0" />
<stop offset="1" stop-color="#1d2943" />
</linearGradient>
<linearGradient id="b">
<stop offset="0" stop-color="#4c5c75" stop-opacity="0" />
<stop offset="1" stop-color="#1d2943" stop-opacity=".7" />
</linearGradient>
<linearGradient
id="l"
x1="45.699"
x2="43.466"
y1="39.083"
y2="36.85"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="m"
x1="40.999"
x2="37.936"
y1="39.418"
y2="36.355"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="n"
x1="32.066"
x2="15.752"
y1="34.112"
y2="-2.667"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#57b3fe" />
<stop offset="1" stop-color="#497bfe" />
</linearGradient>
<linearGradient id="c">
<stop offset="0" stop-color="#ffdd95" />
<stop offset="1" stop-color="#f9a83d" />
</linearGradient>
<radialGradient
id="o"
cx="43.058"
cy="36.516"
r="1.002"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<radialGradient
id="p"
cx="38.023"
cy="36.516"
r="1.002"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<radialGradient
id="q"
cx="-2000.058"
cy="3738.167"
r="11.024"
gradientTransform="rotate(90 874.672 2891.758)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#e9e7fc" />
<stop offset="1" stop-color="#bec3f4" />
</radialGradient>
<linearGradient id="d">
<stop offset="0" stop-color="#4c5c75" stop-opacity="0" />
<stop offset="1" stop-color="#bec3f4" />
</linearGradient>
<linearGradient
id="r"
x1="-1998.051"
x2="-1998.051"
y1="3743.067"
y2="3744.43"
gradientTransform="rotate(90 874.672 2891.758)"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="s"
x1="-1902.247"
x2="-1902.247"
y1="-3337.292"
y2="-3335.899"
gradientTransform="rotate(-90 742.719 -2625.934)"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient id="e">
<stop offset="0" stop-color="#f34b58" />
<stop offset=".377" stop-color="#f14957" />
<stop offset=".591" stop-color="#ec4055" />
<stop offset=".764" stop-color="#e33252" />
<stop offset=".915" stop-color="#d61f4e" />
<stop offset="1" stop-color="#cc104a" />
</linearGradient>
<linearGradient
id="t"
x1="-1998.051"
x2="-1998.051"
y1="3730.479"
y2="3734.53"
gradientTransform="rotate(90 874.672 2891.758)"
gradientUnits="userSpaceOnUse"
href="#e"
/>
<linearGradient id="f">
<stop offset="0" stop-color="#e9e7fc" />
<stop offset=".533" stop-color="#e7e5fc" />
<stop offset=".725" stop-color="#e0e0fa" />
<stop offset=".862" stop-color="#d5d6f8" />
<stop offset=".971" stop-color="#c4c8f5" />
<stop offset="1" stop-color="#bec3f4" />
</linearGradient>
<linearGradient
id="u"
x1="-1812.073"
x2="-1812.073"
y1="3731.344"
y2="3733.027"
gradientTransform="rotate(90 970.672 2795.758)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="v"
x1="-1808.058"
x2="-1808.058"
y1="3731.344"
y2="3733.027"
gradientTransform="rotate(90 970.672 2795.758)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="w"
x1="-1804.043"
x2="-1804.043"
y1="3731.344"
y2="3733.027"
gradientTransform="rotate(90 970.672 2795.758)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="x"
x1="-1800.029"
x2="-1800.029"
y1="3731.344"
y2="3733.027"
gradientTransform="rotate(90 970.672 2795.758)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="y"
x1="-1998.051"
x2="-1998.051"
y1="3743.726"
y2="3747.229"
gradientTransform="rotate(90 874.672 2891.758)"
gradientUnits="userSpaceOnUse"
href="#e"
/>
<linearGradient
id="z"
x1="-492.019"
x2="-492.019"
y1="-3447.363"
y2="-3445.68"
gradientTransform="rotate(-90 1500.023 -1966.988)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="A"
x1="-488.005"
x2="-488.005"
y1="-3447.363"
y2="-3445.68"
gradientTransform="rotate(-90 1500.023 -1966.988)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="B"
x1="-483.99"
x2="-483.99"
y1="-3447.363"
y2="-3445.68"
gradientTransform="rotate(-90 1500.023 -1966.988)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="C"
x1="-479.975"
x2="-479.975"
y1="-3447.363"
y2="-3445.68"
gradientTransform="rotate(-90 1500.023 -1966.988)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="D"
x1="38.451"
x2="39.952"
y1="30.026"
y2="28.526"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="E"
x1="13.667"
x2="5.48"
y1="18.084"
y2="18.084"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient id="g">
<stop offset="0" stop-color="#e3e7f0" />
<stop offset="1" stop-color="#9ea9c9" />
</linearGradient>
<linearGradient
id="F"
x1="-490.014"
x2="-490.014"
y1="-3460.55"
y2="-3458.026"
gradientTransform="rotate(-90 1500.023 -1966.988)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient
id="G"
x1="-486.091"
x2="-484.398"
y1="-3458.812"
y2="-3458.812"
gradientTransform="rotate(-90 1500.023 -1966.988)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient
id="H"
x1="-482.796"
x2="-481.103"
y1="-3458.812"
y2="-3458.812"
gradientTransform="rotate(-90 1500.023 -1966.988)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient
id="I"
x1="-479.501"
x2="-477.807"
y1="-3458.812"
y2="-3458.812"
gradientTransform="rotate(-90 1500.023 -1966.988)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<path
fill="url(#h)"
d="M36.5 45.8c-5-2.6-5.1-6.4-5.1-6.4H20.6s-.2 3.8-5.1 6.4c-.4.2-.7.6-.7 1.1v.1c0 .7.5 1.2 1.2 1.2h20c.7 0 1.2-.5 1.2-1.2v-.1c0-.5-.3-.9-.7-1.1z"
/>
<path
fill="url(#i)"
d="M37.2 47v-.1c0-.5-.3-.9-.7-1.1-5-2.6-5.1-6.4-5.1-6.4H20.6l4.9 8.9H36c.6-.1 1.2-.7 1.2-1.3z"
/>
<path
fill="url(#j)"
d="M47.1 3.8H4.9C3.3 3.8 2 5.1 2 6.7v30c0 1.6 1.3 2.9 2.9 2.9h42.2c1.6 0 2.9-1.3 2.9-2.9v-30c0-1.6-1.3-2.9-2.9-2.9z"
/>
<path
fill="url(#k)"
d="M47.1 3.8H4.9C3.3 3.8 2 5.1 2 6.7v30c0 1.6 1.3 2.9 2.9 2.9h42.2c1.6 0 2.9-1.3 2.9-2.9v-30c0-1.6-1.3-2.9-2.9-2.9z"
/>
<path fill="url(#l)" d="m44.2 35.9-1.7 1.7 2 2h2.9v-.5z" />
<path fill="url(#m)" d="m39.2 35.9-1.7 1.7 2 2h2.9v-.5z" />
<path
fill="url(#n)"
d="M45.1 6.9H7c-1.1 0-2 .9-2 2v23.2c0 1.1.9 2 2 2h37.6c1.4 0 2.5-1.1 2.5-2.5V8.9c0-1.1-.9-2-2-2z"
/>
<circle cx="43.4" cy="36.7" r="1.2" fill="url(#o)" />
<circle cx="38.3" cy="36.7" r="1.2" fill="url(#p)" />
<path
fill="url(#q)"
d="M31.9 9.9h-9.1c-.9 0-.9 18.2 0 18.2h9.1c.6 0 .6-18.2 0-18.2z"
/>
<path
fill="url(#r)"
d="M31.9 9.9h-9.1c-.9 0-.9 18.2 0 18.2h9.1c.6 0 .6-18.2 0-18.2z"
/>
<path
fill="url(#s)"
d="M22.6 28.1h9.3c.9 0 .9-18.2 0-18.2h-9.3c-.6 0-.6 18.2 0 18.2z"
/>
<path
fill="url(#t)"
d="M36 25.7V12.4c0-1.4-1.1-2.5-2.5-2.5h-1.6v18.2h1.6c1.4 0 2.5-1.1 2.5-2.4z"
/>
<path
fill="url(#u)"
d="M34.8 13.6v-1.2c0-.1-.1-.3-.3-.3h-1.2c-.1 0-.3.1-.3.3v1.2c0 .1.1.3.3.3h1.2c.2 0 .3-.1.3-.3z"
/>
<path
fill="url(#v)"
d="M34.8 17.6v-1.2c0-.1-.1-.3-.3-.3h-1.2c-.1 0-.3.1-.3.3v1.2c0 .1.1.3.3.3h1.2c.2 0 .3-.1.3-.3z"
/>
<path
fill="url(#w)"
d="M34.8 21.7v-1.2c0-.1-.1-.3-.3-.3h-1.2c-.1 0-.3.1-.3.3v1.2c0 .1.1.3.3.3h1.2c.2-.1.3-.2.3-.3z"
/>
<path
fill="url(#x)"
d="M34.8 25.7v-1.2c0-.1-.1-.3-.3-.3h-1.2c-.1 0-.3.1-.3.3v1.2c0 .1.1.3.3.3h1.2c.2-.1.3-.2.3-.3z"
/>
<path
fill="url(#y)"
d="M22.8 9.9h-1.6c-1.4 0-2.5 1.1-2.5 2.5v13.3c0 1.4 1.1 2.5 2.5 2.5h1.6z"
/>
<path
fill="url(#z)"
d="M19.9 24.4v1.2c0 .1.1.3.3.3h1.2c.1 0 .3-.1.3-.3v-1.2c0-.1-.1-.3-.3-.3h-1.2c-.1.1-.3.2-.3.3z"
/>
<path
fill="url(#A)"
d="M19.9 20.4v1.2c0 .1.1.3.3.3h1.2c.1 0 .3-.1.3-.3v-1.2c0-.1-.1-.3-.3-.3h-1.2c-.1.1-.3.2-.3.3z"
/>
<path
fill="url(#B)"
d="M19.9 16.4v1.2c0 .1.1.3.3.3h1.2c.1 0 .3-.1.3-.3v-1.2c0-.1-.1-.3-.3-.3h-1.2c-.1.1-.3.2-.3.3z"
/>
<path
fill="url(#C)"
d="M19.9 12.4v1.2c0 .1.1.3.3.3h1.2c.1 0 .3-.1.3-.3v-1.2c0-.1-.1-.3-.3-.3h-1.2c-.1 0-.3.2-.3.3z"
/>
<path
fill="url(#D)"
d="m42.2 29.9-1.5-1.5.5-.5c.2-.2.1-.5-.2-.6l-3-.7c-.2 0-.5.2-.4.4l.7 3c.1.3.4.4.6.2l.5-.5 1.5 1.5c.1.1.4.1.5 0l.8-.8c.1-.2.1-.4 0-.5z"
/>
<path
fill="url(#E)"
d="M9.7 8.8h-3c-.5 0-.9.4-.9.9v16.8c0 .5.4.9.9.9h2.9c.5 0 .9-.4.9-.9V9.7c.1-.5-.3-.9-.8-.9z"
/>
<path
fill="url(#F)"
d="M6.9 20.9v4.3c0 .2.1.3.3.3h2c.2 0 .3-.1.3-.3v-4.3c0-.2-.1-.3-.3-.3h-2c-.2 0-.3.2-.3.3z"
/>
<path
fill="url(#G)"
d="M7.1 17.7v1.2c0 .1.1.2.2.2H9c.1 0 .2-.1.2-.2v-1.2c0-.1-.1-.2-.2-.2H7.3c-.1-.1-.2 0-.2.2z"
/>
<path
fill="url(#H)"
d="M7.1 14.4v1.2c0 .1.1.2.2.2H9c.1 0 .2-.1.2-.2v-1.2c0-.1-.1-.2-.2-.2H7.3c-.1-.1-.2 0-.2.2z"
/>
<path
fill="url(#I)"
d="M7.1 11.1v1.2c0 .1.1.2.2.2H9c.1 0 .2-.1.2-.2v-1.2c0-.1-.1-.2-.2-.2H7.3c-.1-.1-.2.1-.2.2z"
/>
</svg>
More icons in the same style and category