Weather Icons is the only icon font and CSS with 215 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!

Basic Usage

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.

Wind Usage

To use the wind indicators, you must also use weather-icons-wind.min.css along with the default CSS file.

Contributing

If you feel so inclined to add icon ideas, icon art, or other fixes/changes to how the package works, feel free to help!

Credit

The icon designs are originally by Lukas Bischoff. Icon art for v1.1 forward, HTML, Less, and CSS are by me (Erik).

Licensing

Weather Icons licensed under SIL OFL 1.1
Code licensed under MIT License
Documentation licensed under CC BY 3.0

Contact

Weather Icons is maintained by Erik Flowers. Reach me at @Erik_UX or at http://www.helloerik.com.

Languages

CSS 59.8%

HTML 11.6%

Less 10.9%

SCSS 10.6%

Pug 7.1%