IconSearch logoIconsearch
Home/Libraries/Material Line Icons (Iconify)/moon-filled-alt-loop
← Back to Search
Material Line Icons (Iconify)

MoonFilledAltLoop

License: MITCommercial Safe


1.5px
<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24"><g fill="none" stroke="#818cf8" stroke-dasharray="4" stroke-dashoffset="4" stroke-linecap="round" stroke-linejoin="round"><path d="M13 4h1.5M13 4h-1.5M13 4v1.5M13 4v-1.5"><animate id="SVGjUNXVaqx" fill="freeze" attributeName="stroke-dashoffset" begin="0.7s;SVGjUNXVaqx.begin+6s" dur="0.4s" values="4;0"/><animate fill="freeze" attributeName="stroke-dashoffset" begin="SVGjUNXVaqx.begin+2s;SVGjUNXVaqx.begin+4s" dur="0.4s" values="4;0"/><animate fill="freeze" attributeName="stroke-dashoffset" begin="SVGjUNXVaqx.begin+1.2s;SVGjUNXVaqx.begin+3.2s;SVGjUNXVaqx.begin+5.2s" dur="0.4s" values="0;4"/><set fill="freeze" attributeName="d" begin="SVGjUNXVaqx.begin+1.8s" to="M12 5h1.5M12 5h-1.5M12 5v1.5M12 5v-1.5"/><set fill="freeze" attributeName="d" begin="SVGjUNXVaqx.begin+3.8s" to="M12 4h1.5M12 4h-1.5M12 4v1.5M12 4v-1.5"/><set fill="freeze" attributeName="d" begin="SVGjUNXVaqx.begin+5.8s" to="M13 4h1.5M13 4h-1.5M13 4v1.5M13 4v-1.5"/></path><path d="M19 11h1.5M19 11h-1.5M19 11v1.5M19 11v-1.5"><animate id="SVGO88gQckN" fill="freeze" attributeName="stroke-dashoffset" begin="1.1s;SVGO88gQckN.begin+6s" dur="0.4s" values="4;0"/><animate fill="freeze" attributeName="stroke-dashoffset" begin="SVGO88gQckN.begin+2s;SVGO88gQckN.begin+4s" dur="0.4s" values="4;0"/><animate fill="freeze" attributeName="stroke-dashoffset" begin="SVGO88gQckN.begin+1.2s;SVGO88gQckN.begin+3.2s;SVGO88gQckN.begin+5.2s" dur="0.4s" values="0;4"/><set fill="freeze" attributeName="d" begin="SVGO88gQckN.begin+1.8s" to="M17 11h1.5M17 11h-1.5M17 11v1.5M17 11v-1.5"/><set fill="freeze" attributeName="d" begin="SVGO88gQckN.begin+3.8s" to="M18 12h1.5M18 12h-1.5M18 12v1.5M18 12v-1.5"/><set fill="freeze" attributeName="d" begin="SVGO88gQckN.begin+5.8s" to="M19 11h1.5M19 11h-1.5M19 11v1.5M19 11v-1.5"/></path><path d="M19 4h1.5M19 4h-1.5M19 4v1.5M19 4v-1.5"><animate id="SVGPXuakc7A" fill="freeze" attributeName="stroke-dashoffset" begin="2s;SVGPXuakc7A.begin+6s" dur="0.4s" values="4;0"/><animate fill="freeze" attributeName="stroke-dashoffset" begin="SVGPXuakc7A.begin+2s" dur="0.4s" values="4;0"/><animate fill="freeze" attributeName="stroke-dashoffset" begin="SVGPXuakc7A.begin+1.2s;SVGPXuakc7A.begin+3.2s" dur="0.4s" values="0;4"/><set fill="freeze" attributeName="d" begin="SVGPXuakc7A.begin+1.8s" to="M20 5h1.5M20 5h-1.5M20 5v1.5M20 5v-1.5"/><set fill="freeze" attributeName="d" begin="SVGPXuakc7A.begin+5.8s" to="M19 4h1.5M19 4h-1.5M19 4v1.5M19 4v-1.5"/></path></g><path fill="#818cf8" fill-opacity="0" stroke="#818cf8" stroke-dasharray="56" stroke-dashoffset="56" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7 6 C7 12.08 11.92 17 18 17 C18.53 17 19.05 16.96 19.56 16.89 C17.95 19.36 15.17 21 12 21 C7.03 21 3 16.97 3 12 C3 8.83 4.64 6.05 7.11 4.44 C7.04 4.95 7 5.47 7 6 Z"><animate fill="freeze" attributeName="fill-opacity" begin="1.5s" dur="0.5s" values="0;1"/><animate fill="freeze" attributeName="stroke-dashoffset" dur="0.6s" values="56;0"/></path></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. MoonFilledAltLoopIcon.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.

Related Icons in Material Line Icons (Iconify)

Browse all Material Line Icons (Iconify) icons →
account
account
account-add
account-add
account-alert
account-alert
account-alert-loop
account-alert-loop
account-delete
account-delete
account-remove
account-remove
account-small
account-small
alert
alert
alert-circle
alert-circle
alert-circle-loop
alert-circle-loop
alert-circle-twotone
alert-circle-twotone
alert-circle-twotone-loop
alert-circle-twotone-loop