Home/Libraries/Flat UI Icons (Iconify)/weather

Flat UI Icons (Iconify)

Weather

License: MITCommercial Safe

ICON SIZE

COLOR PICKER

Download SVG without fill color (CSS-styleable)

<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 99.5 100"><use href="#SVG2lLLgU3u"/><use href="#SVG2lLLgU3u"/><use href="#SVGGW9ljcnp"/><use href="#SVGGW9ljcnp"/><path fill="#818cf8" d="M50 14c19.882 0 36 16.117 36 36S69.882 86 50 86S14 69.882 14 50s16.117-36 36-36"/><path fill="#818cf8" d="M54 82c-19.882 0-36-16.118-36-36c0-8.923 3.253-17.081 8.629-23.371C18.902 29.232 14 39.041 14 50c0 19.882 16.118 36 36 36c10.973 0 20.781-4.917 27.387-12.655C71.094 78.732 62.934 82 54 82"/><path fill="#818cf8" d="M77.387 73.345C71.094 78.733 62.934 82 53.999 82c-13.017 0-24.417-6.909-30.741-17.259l-4 4C25.582 79.091 36.982 86 49.999 86c10.972 0 20.782-4.917 27.388-12.655"/><defs><path id="SVG2lLLgU3u" fill="#818cf8" d="M45.087 11.319A39 39 0 0 1 50 11c2.033 0 4.029.156 5.979.456L50.5 0zM0 49.5l11.318 5.413A39 39 0 0 1 11 50c0-2.033.156-4.03.456-5.979zm19.082-23.26a39.2 39.2 0 0 1 7.766-7.621l-11.703-3.976zm62.104.34l4.67-11.937l-11.846 4.636a39.3 39.3 0 0 1 7.176 7.301m-7.133 54.108l10.803 3.669l-3.701-10.897a39.3 39.3 0 0 1-7.102 7.228M19.082 73.76l-3.938 11.597l10.869-4.614a39.4 39.4 0 0 1-6.931-6.983m26.005 14.921L50.5 100l5.479-11.456c-1.95.3-3.946.456-5.979.456a39 39 0 0 1-4.913-.319"/><path id="SVGGW9ljcnp" fill="#818cf8" d="m33.104 7.324l-.438 7.739a38.6 38.6 0 0 1 6.484-2.522zM13.039 37.559a38.7 38.7 0 0 1 2.591-5.997l-7.634.477zM68.561 7.014l-6.457 5.911a39 39 0 0 1 7.018 3.088zm-60 61.121l6.852-.12a39 39 0 0 1-2.254-5.22zm25.291 24.879l5.885-5.388a38.7 38.7 0 0 1-6.365-2.346zm34.945-1.518l.428-7.568a39 39 0 0 1-5.994 2.768z"/><path id="SVGR0vFzNrd" fill="#818cf8" d="M95.584 49.709c.582-1.63.916-3.379.916-5.209C96.5 35.939 89.561 29 81 29c-6.523 0-12.096 4.034-14.382 9.74A12.95 12.95 0 0 0 57.5 35c-7.18 0-13 5.82-13 13c0 3.062 1.064 5.872 2.838 8.094c-3.865.564-6.838 3.884-6.838 7.906a8 8 0 0 0 8 8h38c7.18 0 13-5.82 13-13c0-3.643-1.502-6.931-3.916-9.291"/><circle id="SVGwjli4c1i" cx="50" cy="50" r="36"/></defs><clipPath id="SVGxEC66coR"><use href="#SVGwjli4c1i"/></clipPath><path fill="#818cf8" d="M47 41L2 86h84V41z" clip-path="url(#SVGxEC66coR)"/><use href="#SVGR0vFzNrd"/><use href="#SVGR0vFzNrd"/></svg>

Icons in Action

WEB APPLICATION HEADER & NAVIGATION

my-app.com/dashboard

Overview Dashboard

PROGRESS STEPPER

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. WeatherIcon.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 Flat UI Icons (Iconify)

Browse all Flat UI Icons (Iconify) icons →

art

bag

box