Skip to content
shadcn.io

Weather

This icon indicates weather information, forecast data, and atmospheric condition displays in modern interfaces.

Add shadcn.io to your AI agent. · Pro It installs Weather, or any of 294k icons, from a prompt, with Pro.

Set up MCP

Exports at 24 × 24 px

Weather icon from Flat UI Icons
Get Pro

100 in Flat UI IconsMIT license (opens in a new tab)Free to copy and download

Code

Weather in your framework

In any framework. Customize it above, and the code follows.

export const WeatherIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 99.5 100" {...props}>
    <use href="#SVG2lLLgU3u"/><use href="#SVG2lLLgU3u"/><use href="#SVGGW9ljcnp"/><use href="#SVGGW9ljcnp"/><path fill="#F6D759" d="M50 14c19.882 0 36 16.117 36 36S69.882 86 50 86S14 69.882 14 50s16.117-36 36-36"/><path fill="#DDC14E" 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="#C5AE47" 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="#CAA40B" 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="#F1C411" 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="#fff" 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="#DCC050" d="M47 41L2 86h84V41z" clipPath="url(#SVGxEC66coR)"/><use href="#SVGR0vFzNrd"/><use href="#SVGR0vFzNrd"/>
  </svg>
);

Other libraries

Weather in 1 more libraries

Each library draws it its own way. Open one to compare.

  • Weather icon from Arcticons

Flat UI Icons

Icons that share its tags, then the ones next to it in Flat UI Icons, in the same style.

  • Ubmrella icon from Flat UI Icons
  • Spray icon from Flat UI Icons
  • Storage icon from Flat UI Icons
  • Support icon from Flat UI Icons
  • Ticket icon from Flat UI Icons
  • Toilet Paper icon from Flat UI Icons
  • Touch icon from Flat UI Icons
  • Trash icon from Flat UI Icons
  • Trip Bag icon from Flat UI Icons
  • Trunk icon from Flat UI Icons
  • User Interface icon from Flat UI Icons
  • Video icon from Flat UI Icons
  • Wi Fi icon from Flat UI Icons
  • Wine icon from Flat UI Icons
  • Yinyang icon from Flat UI Icons

Skip the copy and paste. With Pro, your AI agent finds and installs any Flat UI Icons icon from a prompt.

Get Pro

Tags

Browse by tag

Weather is tagged environment, climate, forecast and 4 more. Related tags follow; each opens its icons from every library.

Pricing

Flat UI Icons MCP, with Pro

Ask for Weather or any of 100 Flat UI Icons icons and your agent installs it. The MCP comes with every Pro plan, with 6,000+ blocks and 14 premium templates. The icons stay free.

4.9/5 out of 5 · 150+ reviewsfrom 150+ founders and developers.

Billed once a year in USD. Cancel anytime.

Individual

For personal projects & open source

$32instead of $49/mo

$389 billed yearly

  • How many people can use the license.Seats: 1 seat
  • Client work, SaaS products and anything you charge for.Commercial use: Personal & open source only
  • Production-ready React sections: hero, pricing, features, dashboards and more.Pro blocks: 6,000+ blocks
  • Complete multi-page sites you can ship as they are.Templates: All 14 templates
  • React icons from every major library, installable with one command.React icons: 294k+ icons
  • Presets that restyle every block, in light and dark.Themes: All 59 themes
  • Lets your AI editor search, preview and install blocks for you.MCP server: Basic usage
  • Priority requests are answered first.Support: Standard

Team

Most popular

For freelancers, agencies & startups

$66instead of $99/mo

$789 billed yearly · ≈ $13/dev/mo

Everything in Individual, plus

  • How many people can use the license.Seats: Up to 5 seats
  • Client work, SaaS products and anything you charge for.Commercial use: Included
  • Lets your AI editor search, preview and install blocks for you.MCP server: High usage
  • Priority requests are answered first.Support: Priority

Organization

For companies with larger teams

$132instead of $199/mo

$1,589 billed yearly

Everything in Team, plus

  • How many people can use the license.Seats: Unlimited seats
  • Lets your AI editor search, preview and install blocks for you.MCP server: Unlimited usage
  • Secure checkout via Stripe
  • Code lives in your repo
  • Keep what you've shipped if you cancel
  • License terms

FAQ

Frequently asked questions

What the Weather icon means and where it's used, then how to install, style and license it.

Install Weather from a prompt

MCP, 6,000+ blocks and 14 premium templates in every Pro plan. The icons stay free.

Get Pro