Add icons to this collection by clicking the heart icon.
Firework icon - also known as party, celebration, new year, fun, holiday, firework, and birthday and party. Created in a clean color 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 510 510"
>
<linearGradient
id="i"
x1="226.879"
x2="244.36"
y1="402.977"
y2="402.977"
gradientTransform="rotate(45 394.722 380.957)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#8a7889" />
<stop offset="1" stop-color="#6e566e" />
</linearGradient>
<linearGradient id="a">
<stop offset="0" stop-color="#ff7044" />
<stop offset="1" stop-color="#f82814" />
</linearGradient>
<linearGradient
id="j"
x1="367.126"
x2="508.484"
y1="70.678"
y2="70.678"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient id="b">
<stop offset="0" stop-color="#f82814" stop-opacity="0" />
<stop offset="1" stop-color="#c0272d" />
</linearGradient>
<linearGradient
id="k"
x1="410.544"
x2="431.253"
y1="131.729"
y2="72.741"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="l"
x1="2426.066"
x2="2473.324"
y1="365.916"
y2="365.916"
gradientTransform="rotate(45 1161.854 -3680.434) scale(1.349 -1)"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient id="c">
<stop offset="0" stop-color="#f8f6fb" />
<stop offset="1" stop-color="#efdcfb" />
</linearGradient>
<linearGradient
id="m"
x1="243.68"
x2="277.129"
y1="247.759"
y2="282.045"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="n"
x1="288.071"
x2="321.521"
y1="204.45"
y2="238.736"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="o"
x1="338.976"
x2="372.426"
y1="154.787"
y2="189.073"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="p"
x1="389.881"
x2="423.33"
y1="105.123"
y2="139.409"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="q"
x1="419.519"
x2="452.968"
y1="76.208"
y2="110.494"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="r"
x1="2445.532"
x2="2450.286"
y1="216.316"
y2="232.771"
gradientTransform="rotate(45 1161.854 -3680.434) scale(1.349 -1)"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="s"
x1="2446.32"
x2="2449.467"
y1="219.043"
y2="229.937"
gradientTransform="rotate(45 1161.854 -3680.434) scale(1.349 -1)"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient id="d">
<stop offset="0" stop-color="#9b62cd" />
<stop offset=".3" stop-color="#985dcb" />
<stop offset=".672" stop-color="#8f4ec7" />
<stop offset="1" stop-color="#833ac1" />
</linearGradient>
<linearGradient
id="t"
x1="175.614"
x2="148.469"
y1="306.302"
y2="278.054"
gradientTransform="rotate(-90 473.916 0)"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<radialGradient
id="u"
cx="5692.396"
cy="-1553.913"
r="54.538"
gradientTransform="scale(1 -1) rotate(-45 4375.775 5745.218)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#ffd945" />
<stop offset=".417" stop-color="#ffd744" />
<stop offset=".628" stop-color="#ffcf3f" />
<stop offset=".793" stop-color="#ffc237" />
<stop offset=".933" stop-color="#ffaf2c" />
<stop offset="1" stop-color="#ffa325" />
</radialGradient>
<linearGradient
id="v"
x1="5712.606"
x2="5660.245"
y1="-1529.501"
y2="-1581.861"
gradientTransform="scale(1 -1) rotate(-45 4375.775 5745.218)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#ffd945" stop-opacity="0" />
<stop offset="1" stop-color="#fbed21" />
</linearGradient>
<linearGradient
id="w"
x1="5723.596"
x2="5805.132"
y1="-1535.46"
y2="-1604.475"
gradientTransform="scale(1 -1) rotate(-45 4375.775 5745.218)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#e87264" stop-opacity="0" />
<stop offset="1" stop-color="#ff7044" />
</linearGradient>
<linearGradient id="e">
<stop offset="0" stop-color="#ff819c" />
<stop offset=".259" stop-color="#ff7e9a" />
<stop offset=".476" stop-color="#fe7396" />
<stop offset=".676" stop-color="#fc628e" />
<stop offset=".867" stop-color="#fa4a83" />
<stop offset="1" stop-color="#f83479" />
</linearGradient>
<linearGradient
id="x"
x1="-2688.535"
x2="-2669.717"
y1="-4958.324"
y2="-4958.324"
gradientTransform="scale(-1 1) rotate(45 -7742.422 760.507)"
gradientUnits="userSpaceOnUse"
href="#e"
/>
<linearGradient id="f">
<stop offset="0" stop-color="#92f37f" />
<stop offset="1" stop-color="#4ab272" />
</linearGradient>
<linearGradient
id="y"
x1="-2696.463"
x2="-2659.03"
y1="-5028.207"
y2="-4978.295"
gradientTransform="scale(-1 1) rotate(45.08 -7725.192 761.576)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="z"
x1="2055.505"
x2="2074.323"
y1="1789.299"
y2="1789.299"
gradientTransform="scale(1 -1) rotate(45 3775.553 -1534.88)"
gradientUnits="userSpaceOnUse"
href="#e"
/>
<linearGradient
id="A"
x1="2059.708"
x2="2097.141"
y1="1710.856"
y2="1760.767"
gradientTransform="scale(1 -1) rotate(45.08 3771.519 -1538.03)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="B"
x1="-3621.804"
x2="-3602.986"
y1="718.985"
y2="718.985"
gradientTransform="scale(1 -1) rotate(-45 -3090.485 -4340.934)"
gradientUnits="userSpaceOnUse"
href="#e"
/>
<linearGradient
id="C"
x1="-3619.509"
x2="-3582.076"
y1="650.764"
y2="700.675"
gradientTransform="scale(1 -1) rotate(-44.92 -3099.118 -4341.49)"
gradientUnits="userSpaceOnUse"
href="#f"
/>
<linearGradient
id="D"
x1="615.081"
x2="641.185"
y1="-1077.145"
y2="-1077.145"
gradientTransform="matrix(1 0 0 -1 -461.413 -632.226)"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="E"
x1="-1195.185"
x2="-1169.081"
y1="-5786.698"
y2="-5786.698"
gradientTransform="matrix(-1 0 0 1 -1015.413 6031.355)"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="F"
x1="5442.42"
x2="5468.524"
y1="-3946.251"
y2="-3946.251"
gradientTransform="matrix(0 -1 -1 0 -3679.398 5800.26)"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="G"
x1="-6022.524"
x2="-5996.42"
y1="-2917.593"
y2="-2917.593"
gradientTransform="matrix(0 1 1 0 2984.182 6354.26)"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient id="g">
<stop offset="0" stop-color="#00adfb" />
<stop offset="1" stop-color="#3f3ced" />
</linearGradient>
<linearGradient
id="H"
x1="-373.072"
x2="-337.12"
y1="-965.517"
y2="-965.517"
gradientTransform="matrix(.93 .368 .368 -.93 797.03 -284.201)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient
id="I"
x1="-224.036"
x2="-188.083"
y1="-6564.36"
y2="-6564.36"
gradientTransform="scale(-1 1) rotate(-21.59 17540.646 -3134.284)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient
id="J"
x1="2351.931"
x2="2387.884"
y1="-3540.946"
y2="-3540.946"
gradientTransform="scale(1 -1) rotate(68.41 -972.314 -3488.955)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient
id="K"
x1="-2949.039"
x2="-2913.086"
y1="-3988.931"
y2="-3988.931"
gradientTransform="scale(-1 1) rotate(68.41 -4626.352 284.668)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient
id="L"
x1="1686.165"
x2="1722.118"
y1="-1857.554"
y2="-1857.554"
gradientTransform="rotate(-111.6 1633.427 -159.178)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient
id="M"
x1="-2283.274"
x2="-2247.321"
y1="-5672.323"
y2="-5672.323"
gradientTransform="rotate(68.4 -5364.985 -802.17)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient
id="N"
x1="1459.894"
x2="1495.847"
y1="-5600.184"
y2="-5600.184"
gradientTransform="rotate(-21.57 16021.807 881.784)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient
id="O"
x1="-2057.002"
x2="-2021.049"
y1="-1929.693"
y2="-1929.693"
gradientTransform="rotate(158.44 -1138.424 -508)"
gradientUnits="userSpaceOnUse"
href="#g"
/>
<linearGradient id="h">
<stop offset="0" stop-color="#ffd945" />
<stop offset=".304" stop-color="#ffcd3e" />
<stop offset=".856" stop-color="#ffad2b" />
<stop offset="1" stop-color="#ffa325" />
</linearGradient>
<linearGradient
id="P"
x1="-2725.048"
x2="-2706.321"
y1="-1040.374"
y2="-1040.374"
gradientTransform="scale(1 -1) rotate(-65.87 -816.124 -2797.252)"
gradientUnits="userSpaceOnUse"
href="#h"
/>
<linearGradient
id="Q"
x1="-286.079"
x2="-267.352"
y1="175.905"
y2="175.905"
gradientTransform="scale(-1) rotate(22.08 713.743 284.333)"
gradientUnits="userSpaceOnUse"
href="#h"
/>
<linearGradient
id="R"
x1="-409.689"
x2="-390.962"
y1="-110.663"
y2="-110.663"
gradientTransform="scale(-1) rotate(22.08 713.743 284.333)"
gradientUnits="userSpaceOnUse"
href="#h"
/>
<linearGradient
id="S"
x1="-5961.272"
x2="-5942.545"
y1="-951.713"
y2="-951.713"
gradientTransform="scale(-1) rotate(-67.92 -2680.197 -4826.56)"
gradientUnits="userSpaceOnUse"
href="#h"
/>
<path
fill="url(#i)"
d="M179.604 367.765c-5.076-5.076-5.076-13.306 0-18.383L331.926 197.06c5.076-5.076 13.306-5.076 18.383 0 5.076 5.076 5.076 13.306 0 18.383L197.987 367.765c-5.077 5.077-13.307 5.077-18.383 0z"
/>
<path
fill="url(#j)"
d="M486.891 141.184c10.214-1.135 17.818-8.739 18.953-18.953 4.461-40.136 3.757-51.105-5.905-92.141-2.459-10.444-11.105-19.09-21.55-21.548-41.031-9.659-52.002-10.364-92.139-5.905-10.214 1.135-17.819 8.739-18.954 18.954-4.458 40.133 79.462 124.053 119.595 119.593z"
/>
<path
fill="url(#k)"
d="M370.759 18.13a22.916 22.916 0 0 0-2.939.523 22.932 22.932 0 0 0-.523 2.94c-4.459 40.132 79.461 124.052 119.594 119.593a22.916 22.916 0 0 0 2.939-.523c.234-.952.411-1.933.523-2.94C494.811 97.59 410.892 13.67 370.759 18.13z"
/>
<path
fill="url(#l)"
d="M225.06 283.423c-20.201-20.201-33.792-39.361-30.357-42.797L394.857 40.472c3.435-3.435 22.596 10.156 42.797 30.357s33.792 39.361 30.357 42.796L267.856 313.78c-3.435 3.435-22.595-10.156-42.796-30.357z"
/>
<path
fill="url(#m)"
d="m273.75 307.885-5.896 5.895c-2.617 2.618-14.383-4.666-28.784-17.227l-21.491-78.808 24.82-24.82z"
/>
<path
fill="url(#n)"
d="m324.033 257.602-24.811 24.811-31.351-114.959 24.811-24.811z"
/>
<path
fill="url(#o)"
d="m374.325 207.31-24.811 24.811-31.351-114.958 24.811-24.812z"
/>
<path
fill="url(#p)"
d="m424.617 157.018-24.812 24.812-31.351-114.959 24.812-24.811z"
/>
<path
fill="url(#q)"
d="m468.009 113.626-17.921 17.921-18.046-66.189a305.19 305.19 0 0 1 5.611 5.469c20.204 20.203 33.793 39.362 30.356 42.799z"
/>
<path
fill="url(#r)"
d="M267.856 313.78c3.435-3.435-10.156-22.596-30.357-42.796-20.201-20.201-39.362-33.792-42.796-30.357-3.435 3.435 10.156 22.596 30.357 42.796 20.201 20.201 39.361 33.792 42.796 30.357z"
/>
<path
fill="url(#s)"
d="M255.494 301.418c2.274-2.274-6.724-14.959-20.097-28.332s-26.058-22.371-28.332-20.097 6.724 14.959 20.097 28.332c13.374 13.373 26.058 22.371 28.332 20.097z"
/>
<path
fill="url(#t)"
d="M233.372 286.251c-8.663 5.76-18.592 9.658-29.141 11.184-23.775 3.441-43.065 20.977-48.428 44.393l-2.618 11.432c-.776 3.388-3.951 5.822-7.398 5.374a6.668 6.668 0 0 1-3.879-1.899 6.671 6.671 0 0 1-1.791-6.215l2.674-11.672c6.567-28.669 30.055-50.54 59.188-54.576 8.412-1.165 16.338-4.199 23.299-8.689 1.844-1.189 4.256-.975 5.808.576l2.99 2.99c2.057 2.058 1.719 5.491-.704 7.102z"
/>
<circle cx="166.72" cy="344.788" r="43.77" fill="url(#u)" />
<path
fill="url(#v)"
d="M194.348 372.415c15.258-15.258 15.258-39.997 0-55.255s-39.996-15.258-55.254 0-15.258 39.996 0 55.254c15.257 15.259 39.996 15.259 55.254.001z"
/>
<path
fill="url(#w)"
d="M152.879 386.319a43.562 43.562 0 0 0 17.109-10.581c17.093-17.093 17.094-44.807 0-61.901a43.592 43.592 0 0 0-17.109-10.581c15.224-5.061 32.675-1.536 44.791 10.581 17.094 17.094 17.093 44.808 0 61.901-12.115 12.117-29.567 15.642-44.791 10.581z"
/>
<path
fill="url(#x)"
d="M132.033 310.101a9.41 9.41 0 0 0 0-13.306l-14.669-14.669a9.41 9.41 0 0 0-13.306 13.306l14.669 14.669a9.41 9.41 0 0 0 13.306 0z"
/>
<path
fill="url(#y)"
d="M54.078 279.246a100.631 100.631 0 0 1 42.066.124c3.114.675 5.922-2.143 5.235-5.255a100.645 100.645 0 0 1-.278-42.065c.637-3.078-2.143-5.848-5.219-5.2a100.631 100.631 0 0 1-42.066-.125c-3.114-.676-5.922 2.143-5.236 5.254a100.645 100.645 0 0 1 .277 42.065c-.635 3.08 2.145 5.85 5.221 5.202z"
/>
<path
fill="url(#z)"
d="M201.408 379.475a9.41 9.41 0 0 0 0 13.306l14.669 14.669a9.41 9.41 0 0 0 13.306-13.306l-14.669-14.669a9.41 9.41 0 0 0-13.306 0z"
/>
<path
fill="url(#A)"
d="M279.363 410.331a100.631 100.631 0 0 1-42.066-.124c-3.114-.675-5.922 2.143-5.235 5.255a100.628 100.628 0 0 1 .278 42.065c-.637 3.078 2.143 5.848 5.219 5.2a100.631 100.631 0 0 1 42.066.125c3.114.676 5.922-2.143 5.236-5.254a100.645 100.645 0 0 1-.277-42.065c.635-3.081-2.145-5.851-5.221-5.202z"
/>
<path
fill="url(#B)"
d="M132.033 379.475a9.41 9.41 0 0 0-13.306 0l-14.669 14.669a9.41 9.41 0 0 0 13.306 13.306l14.669-14.669a9.408 9.408 0 0 0 0-13.306z"
/>
<path
fill="url(#C)"
d="M101.178 457.431a100.631 100.631 0 0 1 .124-42.066c.675-3.114-2.143-5.922-5.255-5.235a100.628 100.628 0 0 1-42.065.278c-3.078-.637-5.848 2.143-5.2 5.219a100.631 100.631 0 0 1-.125 42.066c-.676 3.114 2.143 5.922 5.254 5.236a100.645 100.645 0 0 1 42.065-.277c3.081.635 5.851-2.145 5.202-5.221z"
/>
<path
fill="url(#D)"
d="M166.721 412.992c-7.208 0-13.052 5.843-13.052 13.052v37.751c0 7.208 5.843 13.052 13.052 13.052 7.208 0 13.052-5.843 13.052-13.052v-37.751c-.001-7.208-5.844-13.052-13.052-13.052z"
/>
<path
fill="url(#E)"
d="M166.721 276.584c7.208 0 13.052-5.843 13.052-13.052v-37.751c0-7.208-5.843-13.052-13.052-13.052-7.208 0-13.052 5.843-13.052 13.052v37.751c0 7.208 5.843 13.052 13.052 13.052z"
/>
<path
fill="url(#F)"
d="M234.925 344.788c0 7.208 5.843 13.052 13.052 13.052h37.751c7.208 0 13.052-5.843 13.052-13.052 0-7.208-5.843-13.052-13.052-13.052h-37.751c-7.209 0-13.052 5.844-13.052 13.052z"
/>
<path
fill="url(#G)"
d="M98.516 344.788c0-7.208-5.843-13.052-13.052-13.052h-37.75c-7.208 0-13.052 5.843-13.052 13.052 0 7.208 5.843 13.052 13.052 13.052h37.751c7.208 0 13.051-5.844 13.051-13.052z"
/>
<path
fill="url(#H)"
d="m128.203 476.288-.18-.419c-3.865-9.061-14.213-13.154-23.23-9.187l-.489.213a17.305 17.305 0 0 0-9.044 22.869l.211.49c3.865 9.061 14.213 13.154 23.23 9.187l.418-.182a17.396 17.396 0 0 0 9.084-22.971z"
/>
<path
fill="url(#I)"
d="m205.239 213.288.18.419c3.865 9.061 14.213 13.154 23.23 9.187l.489-.213a17.305 17.305 0 0 0 9.044-22.869 72.204 72.204 0 0 1-.211-.49c-3.865-9.061-14.213-13.154-23.23-9.187l-.418.182a17.395 17.395 0 0 0-9.084 22.971z"
/>
<path
fill="url(#J)"
d="m298.22 383.306-.419.18c-9.061 3.865-13.154 14.213-9.187 23.23l.213.489a17.305 17.305 0 0 0 22.869 9.044l.49-.211c9.061-3.865 13.154-14.213 9.187-23.23l-.182-.418a17.395 17.395 0 0 0-22.971-9.084z"
/>
<path
fill="url(#K)"
d="m35.221 306.27.419-.18c9.061-3.865 13.154-14.213 9.187-23.23a51.718 51.718 0 0 1-.213-.489 17.305 17.305 0 0 0-22.869-9.044l-.49.211c-9.061 3.865-13.154 14.213-9.187 23.23l.182.418a17.395 17.395 0 0 0 22.971 9.084z"
/>
<path
fill="url(#L)"
d="m35.221 383.306.419.18c9.061 3.865 13.154 14.213 9.187 23.23l-.213.489a17.305 17.305 0 0 1-22.869 9.044 72.204 72.204 0 0 0-.49-.211c-9.061-3.865-13.154-14.213-9.187-23.23l.182-.418a17.395 17.395 0 0 1 22.971-9.084z"
/>
<path
fill="url(#M)"
d="m298.22 306.27-.419-.18c-9.061-3.865-13.154-14.213-9.187-23.23l.213-.489a17.305 17.305 0 0 1 22.869-9.044l.49.211c9.061 3.865 13.154 14.213 9.187 23.23l-.182.418a17.395 17.395 0 0 1-22.971 9.084z"
/>
<path
fill="url(#N)"
d="m128.203 213.288-.18.419c-3.865 9.061-14.213 13.154-23.23 9.187a51.718 51.718 0 0 0-.489-.213 17.305 17.305 0 0 1-9.044-22.869l.211-.49c3.865-9.061 14.213-13.154 23.23-9.187l.418.182a17.396 17.396 0 0 1 9.084 22.971z"
/>
<path
fill="url(#O)"
d="m205.239 476.288.18-.419c3.865-9.061 14.213-13.154 23.23-9.187l.489.213a17.305 17.305 0 0 1 9.044 22.869l-.211.49c-3.865 9.061-14.213 13.154-23.23 9.187l-.418-.182a17.394 17.394 0 0 1-9.084-22.971z"
/>
<circle cx="10.882" cy="347.086" r="9.363" fill="url(#P)" />
<circle cx="163.297" cy="188.616" r="9.363" fill="url(#Q)" />
<circle cx="170.031" cy="500.634" r="9.363" fill="url(#R)" />
<circle cx="319.872" cy="341.258" r="9.363" fill="url(#S)" />
</svg>
More icons in the same style and category