weathericons
Advanced tools
Version 2.0.10 - September 19th, 2015
Weather Icons is the only icon font and CSS with 222 weather themed icons, ready to be dropped right into Bootstrap, or any project that needs high quality weather, maritime, and meteorological based icons!
Get started at http://weathericons.io!
Place the 5 font files and the main weather-icons.min.css file in your project, with the assumption that the fonts are located up ../ from your CSS directory.
The icons are displayed by using an i element and adding the base class wi and then the icon class you want, such as day-sunny. This then looks like <i class="wi wi-day-sunny"></i>.
To add a modifier, include the class you want after the icon name, which looks like <i class="wi wi-day-sunny wi-flip-vertical"></i>. You can flip, rotate, or add a fixed with. See it all at http://weathericons.io.
This set includes companion CSS files for popular weather service API. Presently there are mappings for Forecast.io, Open Weather Map, World Meteorological Organization, Weather Underground, and Yahoo. Check the API List to see the class names.
To use the wind indicators, you must also use weather-icons-wind.min.css along with the default CSS file. To dispay a wind indicator, you must use the base class wi and wi-wind, and then include the towards/from direction you want, like from-293-deg. This ends up looking like . You can use any degree from 0 to 359 in this manner. Note: A "from" class has the point of the arrow at the opposite end of the degree. For example, a "from 90 degrees" icon would point to the 270 degree mark, wheras a "towards 270 degrees" would point at the same 270 degree mark.
Included in the set as well are aliases to point to cardinal directions. They work the same as degrees, for example <i class="wi wi-wind towards-sse"></i> would be an arrow pointing to the South by Southeast (roughly 158 degrees).
If you feel so inclined to add icon ideas, icon art, or other fixes/changes to how the package works, feel free to help!
The icon designs are originally by Lukas Bischoff. Icon art for v1.1 forward, HTML, Less, and CSS are by me (Erik).
Weather Icons is maintained by Erik Flowers. Reach me at @Erik_UX or at http://www.helloerik.com.
FAQs
215 weather themed icons inspired by Font Awesome and ready for Bootstrap
We found that weathericons demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 3 open source maintainers 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.
Research
Security News
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
Security News
Research
A supply chain attack on Rspack's npm packages injected cryptomining malware, potentially impacting thousands of developers.
Research
Security News
Socket researchers discovered a malware campaign on npm delivering the Skuld infostealer via typosquatted packages, exposing sensitive data.
