<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 32 32"><g fill="none"><path fill="url(#ihKbHXc)" d="M17.875 29.743a9.25 9.25 0 0 0 0-18.5h-4.75v1.311a9.24 9.24 0 0 0-4.5 7.94a9.24 9.24 0 0 0 4.5 7.938v1.311z"/><path fill="url(#iNPAmbc)" d="M17.875 29.743a9.25 9.25 0 0 0 0-18.5h-4.75v1.311a9.24 9.24 0 0 0-4.5 7.94a9.24 9.24 0 0 0 4.5 7.938v1.311z"/><path fill="url(#iC3Mh2T)" d="M16.203 29.462c5.109 0 9.25-4.016 9.25-8.969s-4.141-8.968-9.25-8.968h-3.078v1.271c-2.696 1.567-4.5 4.428-4.5 7.697s1.804 6.13 4.5 7.698v1.27z"/><g filter="url(#i7DbNne)"><path stroke="#818cf8" d="M18.719 5.267c.937-.136 3.13.03 4.43 1.804c1.624 2.219.46 5.297-2.758 6.766"/><path stroke="url(#iVcgwvA)" d="M18.719 5.267c.937-.136 3.13.03 4.43 1.804c1.624 2.219.46 5.297-2.758 6.766"/></g><path fill="url(#iDJCdnb)" d="M15 29.743a9.25 9.25 0 0 0 0-18.5h-1.875v.19c-4.21.867-7.375 4.594-7.375 9.06s3.165 8.193 7.375 9.06v.19z"/><path fill="url(#iycj4Vc)" d="M15 29.743a9.25 9.25 0 0 0 0-18.5h-1.875v.19c-4.21.867-7.375 4.594-7.375 9.06s3.165 8.193 7.375 9.06v.19z"/><circle cx="13.125" cy="20.493" r="9.156" fill="#818cf8" fill-opacity=".5"/><g filter="url(#i8c7wsc)"><circle cx="16.418" cy="4.864" r="2.465" stroke="#818cf8"/><circle cx="16.418" cy="4.864" r="2.465" stroke="url(#iEUoLue)"/></g><g filter="url(#iagJYRc)"><circle cx="16.579" cy="4.722" r="2.465" stroke="url(#i5OKvld)" stroke-width="1.5"/></g><circle cx="13.125" cy="20.493" r="9.25" fill="url(#i8hCSuc)"/><circle cx="13.125" cy="20.493" r="9.25" fill="url(#iLOkZtc)"/><circle cx="13.125" cy="20.493" r="9.25" fill="url(#iTnLMye)"/><g filter="url(#i7m4Ene)"><path fill="#818cf8" fill-rule="evenodd" d="M12.867 27.173a6.68 6.68 0 1 0 0-13.36a6.68 6.68 0 0 0 0 13.36m0-1.344a5.336 5.336 0 1 0 0-10.672a5.336 5.336 0 0 0 0 10.672" clip-rule="evenodd"/></g><g filter="url(#iMgTiwe)"><circle cx="12.867" cy="20.493" r="5.334" fill="#818cf8"/></g><g filter="url(#inaFejc)"><path fill="#818cf8" d="M11.279 18.725a.47.47 0 0 0 .334-.23c.206-.347.504-.831.79-1.27a.55.55 0 0 1 .93 0c.28.433.575.91.78 1.255a.49.49 0 0 0 .36.24c.425.054.925.097 1.37.192c.43.092.6.577.318.919c-.241.292-.512.605-.746.876l-.294.342a.5.5 0 0 0-.097.459c.162.567.276 1.07.347 1.464c.082.45-.292.729-.713.562a32 32 0 0 1-1.578-.686a.5.5 0 0 0-.426 0c-.379.176-.98.449-1.578.686c-.42.167-.795-.112-.713-.562c.072-.394.186-.897.347-1.465a.5.5 0 0 0-.096-.458l-.295-.342c-.234-.27-.505-.584-.746-.876a.559.559 0 0 1 .318-.92c.446-.094.978-.127 1.388-.186"/></g><g filter="url(#i4JZstb)"><path fill="#818cf8" d="M11.279 18.725a.47.47 0 0 0 .334-.23c.206-.347.504-.831.79-1.27a.55.55 0 0 1 .93 0c.28.433.575.91.78 1.255a.49.49 0 0 0 .36.24c.425.054.925.097 1.37.192c.43.092.6.577.318.919c-.241.292-.512.605-.746.876l-.294.342a.5.5 0 0 0-.097.459c.162.567.276 1.07.347 1.464c.082.45-.292.729-.713.562a32 32 0 0 1-1.578-.686a.5.5 0 0 0-.426 0c-.379.176-.98.449-1.578.686c-.42.167-.795-.112-.713-.562c.072-.394.186-.897.347-1.465a.5.5 0 0 0-.096-.458l-.295-.342c-.234-.27-.505-.584-.746-.876a.559.559 0 0 1 .318-.92c.446-.094.978-.127 1.388-.186"/></g><defs><radialGradient id="ihKbHXc" cx="0" cy="0" r="1" gradientTransform="rotate(145.355 10.726 12.308)scale(13.0404 13.1312)" gradientUnits="userSpaceOnUse"><stop stop-color="#A28ACF"/><stop offset="1" stop-color="#744EB1"/></radialGradient><radialGradient id="iNPAmbc" cx="0" cy="0" r="1" gradientTransform="matrix(7.93732 .09067 -.10344 9.05502 17.875 20.7)" gradientUnits="userSpaceOnUse"><stop offset=".957" stop-color="#734BAD"/><stop offset=".988" stop-color="#734BAD" stop-opacity="0"/></radialGradient><radialGradient id="iC3Mh2T" cx="0" cy="0" r="1" gradientTransform="matrix(7.94324 -8.94917 30.58233 27.14472 18.659 27.739)" gradientUnits="userSpaceOnUse"><stop stop-color="#543A6E"/><stop offset="1" stop-color="#442662"/></radialGradient><radialGradient id="iVcgwvA" cx="0" cy="0" r="1" gradientTransform="matrix(3.26418 -2.26687 3.55398 5.11754 20.614 9.366)" gradientUnits="userSpaceOnUse"><stop offset=".782" stop-color="#FCCA60" stop-opacity="0"/><stop offset="1" stop-color="#FCCA60"/></radialGradient><radialGradient id="iDJCdnb" cx="0" cy="0" r="1" gradientTransform="matrix(-12.31257 8.68749 -7.9191 -11.22355 23.672 16.337)" gradientUnits="userSpaceOnUse"><stop stop-color="#B090E1"/><stop offset="1" stop-color="#8357C5"/></radialGradient><radialGradient id="iycj4Vc" cx="0" cy="0" r="1" gradientTransform="matrix(8.34375 0 0 8.92433 14.36 20.493)" gradientUnits="userSpaceOnUse"><stop offset=".897" stop-color="#AF8CE6"/><stop offset=".976" stop-color="#AF8CE6" stop-opacity="0"/></radialGradient><radialGradient id="iEUoLue" cx="0" cy="0" r="1" gradientTransform="matrix(4.46042 -1.8199 2.0919 5.12705 12.68 7.013)" gradientUnits="userSpaceOnUse"><stop stop-color="#E9B443"/><stop offset="1" stop-color="#E9B443" stop-opacity="0"/></radialGradient><radialGradient id="i8hCSuc" cx="0" cy="0" r="1" gradientTransform="rotate(-60.714 30.123 5.264)scale(20.3152)" gradientUnits="userSpaceOnUse"><stop stop-color="#9268D7"/><stop offset="1" stop-color="#9469D5"/></radialGradient><radialGradient id="iLOkZtc" cx="0" cy="0" r="1" gradientTransform="translate(12.764 20.493)scale(9.61084)" gradientUnits="userSpaceOnUse"><stop offset=".967" stop-color="#AB87E5" stop-opacity="0"/><stop offset="1" stop-color="#AB87E5"/></radialGradient><radialGradient id="iTnLMye" cx="0" cy="0" r="1" gradientTransform="rotate(90 -3.512 16.637)scale(9.59375)" gradientUnits="userSpaceOnUse"><stop offset=".965" stop-color="#8653D0" stop-opacity="0"/><stop offset="1" stop-color="#8653D0"/></radialGradient><filter id="i7DbNne" width="5.88" height="9.561" x="18.647" y="4.731" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx=".15"/><feGaussianBlur stdDeviation=".2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.85098 0 0 0 0 0.631373 0 0 0 0 0.266667 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_3277"/></filter><filter id="i8c7wsc" width="6.18" height="6.18" x="13.453" y="1.649" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx=".25" dy="-.25"/><feGaussianBlur stdDeviation=".2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.85098 0 0 0 0 0.631373 0 0 0 0 0.266667 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_3277"/></filter><filter id="iagJYRc" width="5.68" height="5.68" x="13.739" y="1.882" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_18_3277" stdDeviation=".125"/></filter><filter id="i7m4Ene" width="14.159" height="13.359" x="5.787" y="13.813" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="-.6"/><feGaussianBlur stdDeviation=".2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.74902 0 0 0 0 0.509804 0 0 0 0 0.980392 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_3277"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx=".4"/><feGaussianBlur stdDeviation=".2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.819608 0 0 0 0 0.619608 0 0 0 0 1 0 0 0 1 0"/><feBlend in2="effect1_innerShadow_18_3277" result="effect2_innerShadow_18_3277"/></filter><filter id="iMgTiwe" width="10.917" height="10.917" x="7.533" y="14.91" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx=".25" dy="-.25"/><feGaussianBlur stdDeviation=".25"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.556863 0 0 0 0 0.388235 0 0 0 0 0.815686 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_3277"/></filter><filter id="inaFejc" width="8.865" height="8.615" x="8.434" y="15.968" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_18_3277" stdDeviation=".5"/></filter><filter id="i4JZstb" width="7.665" height="7.415" x="8.934" y="16.668" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx=".3" dy="-.3"/><feGaussianBlur stdDeviation=".4"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.823529 0 0 0 0 0.631373 0 0 0 0 1 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_3277"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="-.5" dy=".5"/><feGaussianBlur stdDeviation=".375"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.713726 0 0 0 0 0.47451 0 0 0 0 0.956863 0 0 0 1 0"/><feBlend in2="effect1_innerShadow_18_3277" result="effect2_innerShadow_18_3277"/></filter><linearGradient id="i5OKvld" x1="18.674" x2="15.248" y1="2.981" y2="7.187" gradientUnits="userSpaceOnUse"><stop stop-color="#FDCD63"/><stop offset=".186" stop-color="#FDCD63" stop-opacity="0"/><stop offset=".86" stop-color="#FDCD63" stop-opacity="0"/><stop offset="1" stop-color="#FDCD63"/></linearGradient></defs></g></svg>Icons in Action
WEB APPLICATION HEADER & NAVIGATION
my-app.com/dashboard
Dashboard
Analytics
Settings
Overview Dashboard
PROGRESS STEPPER
3
BUTTON UI ACTIONS
SCALABILITY & CLARITY
12px
16px
24px
32px
48px
“
Highly adaptable, clean vectors that scale perfectly across modern UI components, navigation bars, and mobile actions. Perfectly pre-vetted for production deployment.
IconSearch Presets
Frequently Asked Questions
Q.How do I use this icon in my React/Next.js project?
You have two choices: install the official package listed under the "REACT IMPORT" tab (e.g. npm install @iconify/react) and import the icon directly, or copy the complete React Component code from the "STANDALONE JSX" tab and paste it directly into a local file (e.g. YoYoIcon.tsx) to avoid installing any npm packages.
Q.Is this icon free for commercial use?
Yes. This icon is published under the open-source **MIT** license. The license grants full permissions for personal and commercial usage (e.g., in SaaS platforms, client projects, or business landing pages). Attributing the icon creator is generally not required for MIT/ISC licenses, but check details on our dedicated License Guide.
Q.What is the "Download SVG without fill color" toggle?
Many SVGs ship with inline fill="..." attributes. By checking this toggle, we strip these attributes and enforce fill="none", making the SVG fully styleable via CSS classes or Tailwind utility classes like fill-current.