<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(#iz4o4Ee)" d="M13.658 23.946h4.675v2.002h-4.675z"/><path fill="url(#iiuIbdb)" d="M13.658 23.946h4.675v2.002h-4.675z"/><g filter="url(#itrPD9b)"><path fill="url(#ixBzUjc)" d="M9.082 27.234a2.5 2.5 0 0 1 2.185-1.286H20.7a2.5 2.5 0 0 1 2.18 1.277l1.023 1.824a.6.6 0 0 1-.524.893H8.597a.6.6 0 0 1-.525-.891z"/></g><path fill="url(#il1dNBi)" d="M9.082 27.234a2.5 2.5 0 0 1 2.185-1.286H20.7a2.5 2.5 0 0 1 2.18 1.277l1.023 1.824a.6.6 0 0 1-.524.893H8.597a.6.6 0 0 1-.525-.891z"/><g filter="url(#idUUfBs)"><path fill="url(#iags27d)" d="M9.993 7.03a5 5 0 0 1 5-5h2.013a5 5 0 0 1 5 5v9.983a5 5 0 0 1-5 5h-2.013a5 5 0 0 1-5-5z"/></g><path fill="url(#iq6eKxb)" d="M9.993 7.03a5 5 0 0 1 5-5h2.013a5 5 0 0 1 5 5v9.983a5 5 0 0 1-5 5h-2.013a5 5 0 0 1-5-5z"/><path fill="url(#isy1bNc)" d="M9.993 7.03a5 5 0 0 1 5-5h2.013a5 5 0 0 1 5 5v9.983a5 5 0 0 1-5 5h-2.013a5 5 0 0 1-5-5z"/><path fill="url(#iOSUJ8d)" d="M9.993 9.605v-1.47h4.794a.735.735 0 0 1 0 1.47z"/><path fill="url(#iIxFjUd)" d="M9.993 12.756v-1.47h4.794a.735.735 0 0 1 0 1.47z"/><path fill="url(#i6AZkNd)" d="M9.993 15.907v-1.47h4.794a.735.735 0 0 1 0 1.47z"/><path fill="url(#iLAjALL)" d="M22.007 8.135v1.47h-4.794a.735.735 0 1 1 0-1.47z"/><path fill="url(#iDp2uwm)" d="M22.007 11.287v1.47h-4.794a.735.735 0 1 1 0-1.47z"/><path fill="url(#icONWJc)" d="M22.007 14.438v1.47h-4.794a.735.735 0 1 1 0-1.47z"/><g filter="url(#i20QKbd)"><path fill="url(#i3mXy7b)" d="M24.97 13.945a1 1 0 1 0-2 0zm-15.94 0a1 1 0 1 0-2 0zm13.94 0v4h2v-4zm-5 9h-3.94v2h3.94zm-8.94-5v-4h-2v4zm5 5a5 5 0 0 1-5-5h-2a7 7 0 0 0 7 7zm8.94-5a5 5 0 0 1-5 5v2a7 7 0 0 0 7-7z"/><path fill="url(#iUrW7mB)" d="M24.97 13.945a1 1 0 1 0-2 0zm-15.94 0a1 1 0 1 0-2 0zm13.94 0v4h2v-4zm-5 9h-3.94v2h3.94zm-8.94-5v-4h-2v4zm5 5a5 5 0 0 1-5-5h-2a7 7 0 0 0 7 7zm8.94-5a5 5 0 0 1-5 5v2a7 7 0 0 0 7-7z"/></g><g filter="url(#itqM6jc)"><path fill="url(#iSXvmdb)" d="M24.578 13.649a.325.325 0 1 0-.65 0zm-15.9 0a.325.325 0 1 0-.65 0zm15.25 0v4.12h.65v-4.12zm-5.66 9.972h-3.93v.65h3.93zm-9.59-5.853v-4.12h-.65v4.12zm5.66 5.853c-3.116 0-5.66-2.61-5.66-5.853h-.65c0 3.582 2.816 6.503 6.31 6.503zm9.59-5.853c0 3.242-2.544 5.853-5.66 5.853v.65c3.494 0 6.31-2.921 6.31-6.503z"/><path fill="url(#inLgEKd)" d="M24.578 13.649a.325.325 0 1 0-.65 0zm-15.9 0a.325.325 0 1 0-.65 0zm15.25 0v4.12h.65v-4.12zm-5.66 9.972h-3.93v.65h3.93zm-9.59-5.853v-4.12h-.65v4.12zm5.66 5.853c-3.116 0-5.66-2.61-5.66-5.853h-.65c0 3.582 2.816 6.503 6.31 6.503zm9.59-5.853c0 3.242-2.544 5.853-5.66 5.853v.65c3.494 0 6.31-2.921 6.31-6.503z"/></g><defs><radialGradient id="iiuIbdb" cx="0" cy="0" r="1" gradientTransform="matrix(0 -2.5625 1.55303 0 16.746 26.687)" gradientUnits="userSpaceOnUse"><stop stop-color="#B9B6BD"/><stop offset="1" stop-color="#B9B6BD" stop-opacity="0"/></radialGradient><radialGradient id="ixBzUjc" cx="0" cy="0" r="1" gradientTransform="matrix(0 -4.59853 9.93119 0 21.058 29.942)" gradientUnits="userSpaceOnUse"><stop stop-color="#E1D9EB"/><stop offset="1" stop-color="#AFA9B5"/></radialGradient><radialGradient id="iags27d" cx="0" cy="0" r="1" gradientTransform="matrix(0 11.9063 -7.34787 0 16 12.781)" gradientUnits="userSpaceOnUse"><stop stop-color="#B1A9BA"/><stop offset="1" stop-color="#C7C4CA"/></radialGradient><radialGradient id="iq6eKxb" cx="0" cy="0" r="1" gradientTransform="matrix(-4.93753 4.18747 -5.89101 -6.9462 19.746 4.625)" gradientUnits="userSpaceOnUse"><stop stop-color="#F3F1F5"/><stop offset="1" stop-color="#D1CED4" stop-opacity="0"/></radialGradient><radialGradient id="isy1bNc" cx="0" cy="0" r="1" gradientTransform="matrix(0 -5.94995 7.5 0 15.496 22.012)" gradientUnits="userSpaceOnUse"><stop stop-color="#A89AB7"/><stop offset="1" stop-color="#A89AB7" stop-opacity="0"/></radialGradient><radialGradient id="iIxFjUd" cx="0" cy="0" r="1" gradientTransform="matrix(0 2.34375 -7.37072 0 12.758 10.906)" gradientUnits="userSpaceOnUse"><stop offset=".427" stop-color="#2E223B"/><stop offset="1" stop-color="#543F68"/></radialGradient><radialGradient id="i6AZkNd" cx="0" cy="0" r="1" gradientTransform="matrix(0 2.34375 -7.37072 0 12.758 14.057)" gradientUnits="userSpaceOnUse"><stop offset=".427" stop-color="#2E223B"/><stop offset="1" stop-color="#543F68"/></radialGradient><radialGradient id="iLAjALL" cx="0" cy="0" r="1" gradientTransform="matrix(0 1.46957 -4.62157 0 19.242 8.135)" gradientUnits="userSpaceOnUse"><stop offset=".355" stop-color="#2E223B"/><stop offset="1" stop-color="#473A55"/></radialGradient><radialGradient id="iDp2uwm" cx="0" cy="0" r="1" gradientTransform="matrix(0 2.03125 -6.38796 0 19.242 10.906)" gradientUnits="userSpaceOnUse"><stop offset=".118" stop-color="#2E223B"/><stop offset="1" stop-color="#543F68"/></radialGradient><radialGradient id="icONWJc" cx="0" cy="0" r="1" gradientTransform="matrix(0 2.34375 -7.37072 0 19.242 14.057)" gradientUnits="userSpaceOnUse"><stop offset=".427" stop-color="#2E223B"/><stop offset="1" stop-color="#543F68"/></radialGradient><radialGradient id="iUrW7mB" cx="0" cy="0" r="1" gradientTransform="matrix(1.93317 7.77202 -3.91825 .9746 10.84 16.174)" gradientUnits="userSpaceOnUse"><stop offset=".384" stop-color="#959199"/><stop offset="1" stop-color="#959199" stop-opacity="0"/></radialGradient><radialGradient id="iSXvmdb" cx="0" cy="0" r="1" gradientTransform="rotate(99.112 6.812 17.256)scale(15.5586 7.78551)" gradientUnits="userSpaceOnUse"><stop stop-color="#DFDAE4"/><stop offset="1" stop-color="#DFDAE4" stop-opacity="0"/></radialGradient><radialGradient id="inLgEKd" cx="0" cy="0" r="1" gradientTransform="matrix(9.38295 13.83722 -3.98567 2.70267 8.676 13.1)" gradientUnits="userSpaceOnUse"><stop stop-color="#B8ADC4"/><stop offset="1" stop-color="#B8ADC4" stop-opacity="0"/></radialGradient><linearGradient id="iz4o4Ee" x1="14.277" x2="18.496" y1="25.948" y2="25.948" gradientUnits="userSpaceOnUse"><stop stop-color="#A29FA5"/><stop offset="1" stop-color="#B2AFB5"/></linearGradient><linearGradient id="il1dNBi" x1="16.277" x2="16.277" y1="30.281" y2="29.313" gradientUnits="userSpaceOnUse"><stop offset=".145" stop-color="#B697D5"/><stop offset="1" stop-color="#9E87B4" stop-opacity="0"/></linearGradient><linearGradient id="iOSUJ8d" x1="12.758" x2="15.522" y1="8.312" y2="9.605" gradientUnits="userSpaceOnUse"><stop stop-color="#2E213A"/><stop offset="1" stop-color="#382549"/></linearGradient><linearGradient id="i3mXy7b" x1="8.551" x2="24.608" y1="21.223" y2="21.223" gradientUnits="userSpaceOnUse"><stop stop-color="#A9A3B1"/><stop offset="1" stop-color="#C7C1CE"/></linearGradient><filter id="itrPD9b" width="16.484" height="4.195" x="7.996" y="25.948" 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=".5" dy=".2"/><feGaussianBlur stdDeviation=".5"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.619608 0 0 0 0 0.611765 0 0 0 0 0.631373 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_18081"/></filter><filter id="idUUfBs" width="12.263" height="20.232" x="9.993" y="1.78" 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/><feGaussianBlur stdDeviation="1"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.678431 0 0 0 0 0.678431 0 0 0 0 0.678431 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_18081"/><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=".5"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.576471 0 0 0 0 0.556863 0 0 0 0 0.6 0 0 0 1 0"/><feBlend in2="effect1_innerShadow_18_18081" result="effect2_innerShadow_18_18081"/></filter><filter id="i20QKbd" width="17.939" height="12.101" x="7.031" y="12.845" 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 dy="-.1"/><feGaussianBlur stdDeviation=".25"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.709804 0 0 0 0 0.682353 0 0 0 0 0.737255 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_18081"/></filter><filter id="itqM6jc" width="17.849" height="12.247" x="7.379" y="12.674" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_18_18081" stdDeviation=".325"/></filter></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. StudioMicrophoneIcon.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.