react-yr-weather-icons
Advanced tools
A React library providing weather icons based on the Yr.no weather service
Easily use Yr weather icons in your React application. All light and dark variants are available as TypeScript-ready React components.
npm i react-yr-weather-icons
import { YrWeatherIcon } from "react-yr-weather-icons";
function YourApp() {
return <YrWeatherIcon symbolCode="clearsky_day" />;
}
Main properties
| Key | Default | Notes |
|---|---|---|
symbolCode | Use any symbol code from Yr, example: clearsky_day or clearsky_night | |
mode | light | The mode of the icons, example: light or dark |
size | 40 | |
className | ||
title | ||
titleId |
All standard SVG properties except width and height are also supported. Use size instead of width and height.
clearsky_day
clearsky_night
clearsky_polartwilight
cloudy
fair_day
fair_night
fair_polartwilight
fog
heavyrain
heavyrainandthunder
heavyrainshowers_day
heavyrainshowers_night
heavyrainshowers_polartwilight
heavyrainshowersandthunder_day
heavyrainshowersandthunder_night
heavyrainshowersandthunder_polartwilight
heavysleet
heavysleetandthunder
heavysleetshowers_day
heavysleetshowers_night
heavysleetshowers_polartwilight
heavysleetshowersandthunder_day
heavysleetshowersandthunder_night
heavysleetshowersandthunder_polartwilight
heavysnow
heavysnowandthunder
heavysnowshowers_day
heavysnowshowers_night
heavysnowshowers_polartwilight
heavysnowshowersandthunder_day
heavysnowshowersandthunder_night
heavysnowshowersandthunder_polartwilight
lightrain
lightrainandthunder
lightrainshowers_day
lightrainshowers_night
lightrainshowers_polartwilight
lightrainshowersandthunder_day
lightrainshowersandthunder_night
lightrainshowersandthunder_polartwilight
lightsleet
lightsleetandthunder
lightsleetshowers_day
lightsleetshowers_night
lightsleetshowers_polartwilight
lightsnow
lightsnowandthunder
lightsnowshowers_day
lightsnowshowers_night
lightsnowshowers_polartwilight
lightssleetshowersandthunder_day
lightssleetshowersandthunder_night
lightssleetshowersandthunder_polartwilight
lightssnowshowersandthunder_day
lightssnowshowersandthunder_night
lightssnowshowersandthunder_polartwilight
partlycloudy_day
partlycloudy_night
partlycloudy_polartwilight
rain
rainandthunder
rainshowers_day
rainshowers_night
rainshowers_polartwilight
rainshowersandthunder_day
rainshowersandthunder_night
rainshowersandthunder_polartwilight
sleet
sleetandthunder
sleetshowers_day
sleetshowers_night
sleetshowers_polartwilight
sleetshowersandthunder_day
sleetshowersandthunder_night
sleetshowersandthunder_polartwilight
snow
snowandthunder
snowshowers_day
snowshowers_night
snowshowers_polartwilight
snowshowersandthunder_day
snowshowersandthunder_night
snowshowersandthunder_polartwilight
MIT
FAQs
A React library providing weather icons based on the Yr.no weather service
The npm package react-yr-weather-icons receives a total of 0 weekly downloads. As such, react-yr-weather-icons popularity was classified as not popular.
We found that react-yr-weather-icons demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
/Research
Malicious npm package impersonates Nodemailer and drains wallets by hijacking crypto transactions across multiple blockchains.
Security News
This episode explores the hard problem of reachability analysis, from static analysis limits to handling dynamic languages and massive dependency trees.
Security News
/Research
Malicious Nx npm versions stole secrets and wallet info using AI CLI tools; Socket’s AI scanner detected the supply chain attack and flagged the malware.