Add icons to this collection by clicking the heart icon.
Tangram icon - also known as leisure, board game, hobbies and free time, and tangram. 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 512 512"
>
<linearGradient
id="e"
x1="74.98"
x2="437.018"
y1="437.019"
y2="74.98"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#00aa45" />
<stop offset="1" stop-color="#d3ff33" />
</linearGradient>
<radialGradient
id="f"
cx="256"
cy="256"
r="256"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#00aa45" />
<stop offset="1" stop-color="#e6fe7f" stop-opacity="0" />
</radialGradient>
<linearGradient id="a">
<stop offset="0" stop-color="#ddff59" />
<stop offset="1" stop-color="#fff" />
</linearGradient>
<linearGradient
id="g"
x1="-636.888"
x2="443.857"
y1="1256.651"
y2="175.906"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="h"
x1="-113.578"
x2="446.026"
y1="600.807"
y2="41.203"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient id="b">
<stop offset="0" stop-color="#b8ef5c" />
<stop offset=".362" stop-color="#ddff59" />
<stop offset="1" stop-color="#fff" />
</linearGradient>
<linearGradient
id="i"
x1="53.246"
x2="854.265"
y1="348.243"
y2="-452.776"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="j"
x1="-127.216"
x2="770.63"
y1="653.936"
y2="-243.91"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient id="c">
<stop offset=".421" stop-color="#e6fe7f" stop-opacity="0" />
<stop offset=".644" stop-color="#e4fd7e" stop-opacity=".422" />
<stop offset=".724" stop-color="#ddfb7b" stop-opacity=".573" />
<stop offset=".781" stop-color="#d1f774" stop-opacity=".682" />
<stop offset=".828" stop-color="#c1f16c" stop-opacity=".769" />
<stop offset=".867" stop-color="#abe960" stop-opacity=".844" />
<stop offset=".902" stop-color="#8fdf52" stop-opacity=".911" />
<stop offset=".933" stop-color="#70d442" stop-opacity=".969" />
<stop offset=".95" stop-color="#5ccd38" />
</linearGradient>
<linearGradient
id="k"
x1="115.575"
x2="443.492"
y1="256"
y2="256"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="l"
x1="125.575"
x2="453.492"
y1="346"
y2="346"
gradientTransform="rotate(-90 216 306)"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="m"
x1="35.575"
x2="363.492"
y1="356"
y2="356"
gradientTransform="rotate(180 216 306)"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="n"
x1="25.575"
x2="353.492"
y1="266"
y2="266"
gradientTransform="rotate(90 216 306)"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient id="d">
<stop offset="0" stop-color="#008547" />
<stop offset=".121" stop-color="#128f45" />
<stop offset=".365" stop-color="#41aa41" />
<stop offset=".705" stop-color="#8cd63a" />
<stop offset="1" stop-color="#d3ff33" />
</linearGradient>
<linearGradient
id="o"
x1="229.967"
x2="569.124"
y1="390.61"
y2="51.453"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="p"
x1="-134.615"
x2="389.438"
y1="670.65"
y2="146.597"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="q"
x1="-246.509"
x2="339.236"
y1="797.774"
y2="212.029"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="r"
x1="-338.633"
x2="439.704"
y1="882.408"
y2="104.071"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="s"
x1="61.522"
x2="560.643"
y1="480.985"
y2="-18.137"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="t"
x1="-90.587"
x2="508.491"
y1="494.01"
y2="-105.068"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="u"
x1="123.956"
x2="649.375"
y1="279.468"
y2="-245.952"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<circle cx="256" cy="256" r="256" fill="url(#e)" />
<circle cx="256" cy="256" r="256" fill="url(#f)" />
<path
fill="url(#g)"
d="M378 87.053c-15-.548-30-.995-45-1.341a7531.89 7531.89 0 0 1 0 340.575c15-.346 30-.793 45-1.341 24.782-.959 45.987-22.166 46.947-46.947a3340.955 3340.955 0 0 0 0-244c-.96-24.779-22.165-45.987-46.947-46.946z"
/>
<path
fill="url(#h)"
d="M333 85.713a3340.289 3340.289 0 0 0-199 1.341c-24.781.958-45.988 22.165-46.947 46.946a3340.955 3340.955 0 0 0 0 244c.959 24.781 22.166 45.987 46.947 46.947a3341.134 3341.134 0 0 0 199 1.341c16.541-.395 30.414-14.474 30.875-31.268 2.4-92.679 2.4-185.359 0-278.038-.461-16.795-14.334-30.874-30.875-31.269z"
/>
<path
fill="url(#i)"
d="M133.003 117.403c-8.334.253-15.347 7.266-15.6 15.6a4139.44 4139.44 0 0 0 0 245.995c.252 8.332 7.266 15.347 15.6 15.6 10.082.3 20.163.562 30.245.789a6276.07 6276.07 0 0 1 0-278.771 4123.29 4123.29 0 0 0-30.245.787z"
/>
<path
fill="url(#j)"
d="M378.997 117.403a4138.357 4138.357 0 0 0-215.749-.788c-8.333.191-15.296 7.2-15.495 15.588-.117 5.074-.227 10.147-.33 15.221 14.54 33.348 29.683 67.046 45.03 100.915-15.406 39.002-30.592 77.817-45.03 116.238.102 5.074.212 10.147.33 15.221.199 8.388 7.162 15.397 15.495 15.588a4138.353 4138.353 0 0 0 215.749-.789c8.335-.253 15.347-7.268 15.6-15.6a4139.44 4139.44 0 0 0 0-245.995c-.253-8.332-7.267-15.346-15.6-15.599z"
/>
<path
fill="url(#k)"
d="M133.003 394.597c-8.334-.253-15.347-7.268-15.6-15.6a4139.44 4139.44 0 0 1 0-245.995c.252-8.332 7.266-15.347 15.6-15.6a4139.44 4139.44 0 0 1 245.995 0c8.335.253 15.347 7.266 15.6 15.6a4139.44 4139.44 0 0 1 0 245.995c-.253 8.332-7.267 15.347-15.6 15.6a4139.44 4139.44 0 0 1-245.995 0z"
/>
<path
fill="url(#l)"
d="M394.597 378.998c-.254 8.333-7.266 15.347-15.6 15.6a4139.44 4139.44 0 0 1-245.995 0c-8.333-.253-15.348-7.267-15.6-15.6a4139.44 4139.44 0 0 1 0-245.995c.254-8.333 7.266-15.347 15.6-15.6a4139.44 4139.44 0 0 1 245.995 0c8.334.253 15.345 7.266 15.6 15.6a4139.44 4139.44 0 0 1 0 245.995z"
/>
<path
fill="url(#m)"
d="M378.997 117.403c8.335.253 15.347 7.266 15.6 15.6a4139.44 4139.44 0 0 1 0 245.995c-.253 8.332-7.267 15.347-15.6 15.6a4139.44 4139.44 0 0 1-245.995 0c-8.334-.253-15.347-7.268-15.6-15.6a4139.44 4139.44 0 0 1 0-245.995c.252-8.332 7.266-15.347 15.6-15.6a4139.44 4139.44 0 0 1 245.995 0z"
/>
<path
fill="url(#n)"
d="M117.403 133.003c.254-8.333 7.266-15.347 15.6-15.6a4139.44 4139.44 0 0 1 245.995 0c8.334.253 15.345 7.266 15.6 15.6a4139.44 4139.44 0 0 1 0 245.995c-.254 8.333-7.266 15.347-15.6 15.6a4139.44 4139.44 0 0 1-245.995 0c-8.333-.253-15.348-7.267-15.6-15.6a4139.44 4139.44 0 0 1 0-245.995z"
/>
<path
fill="url(#o)"
d="M256 256v109.675c36.192 0 72.385-.366 108.577-1.098A5369.342 5369.342 0 0 0 365.675 256H256z"
/>
<path
fill="url(#p)"
d="M170.454 279.941c-7.927 28.328-15.653 56.553-23.031 84.636 36.192.732 72.385 1.098 108.577 1.098a15434.688 15434.688 0 0 1 54.7-54.975c-46.64-9.99-93.425-20.411-140.246-30.759z"
/>
<path
fill="url(#q)"
d="M310.7 310.7c-18.091-28.366-36.435-56.921-54.7-85.45a54690.164 54690.164 0 0 1-85.373 85.253c46.691.366 93.382.432 140.073.197z"
/>
<path
fill="url(#r)"
d="M256 209.875c36.493 15.375 73.117 30.904 109.675 46.125 0-36.192-.366-72.384-1.098-108.577-35.768 20.239-72.083 41.269-108.577 62.452z"
/>
<path
fill="url(#s)"
d="m256 256 54.7 54.7a15434.688 15434.688 0 0 1 54.975-54.7 15491.664 15491.664 0 0 1-79.279-79.058C276.37 203.253 266.185 229.627 256 256z"
/>
<path
fill="url(#t)"
d="M147.423 147.423a5368.93 5368.93 0 0 0 0 217.154L256 256v-46.125c-36.494-21.183-72.809-42.213-108.577-62.452z"
/>
<path
fill="url(#u)"
d="M147.423 147.423 256 256l108.577-108.577a5368.93 5368.93 0 0 0-217.154 0z"
/>
</svg>
More icons in the same style and category