2013-06-29 21:15:46 -06:00
<!DOCTYPE html>
2014-05-31 13:08:08 -07:00
< html >
2013-06-29 21:15:46 -06:00
< head >
2014-11-30 15:52:49 -08:00
< title > Weather Icons - 189 Icon Font inspired by Font Awesome and designed for Bootstrap< / title >
2014-09-26 10:21:48 -07:00
<!-- favicons -->
< link rel = "apple-touch-icon" sizes = "57x57" href = "/apple-touch-icon-57x57.png" >
< link rel = "apple-touch-icon" sizes = "60x60" href = "/apple-touch-icon-60x60.png" >
< link rel = "icon" type = "image/png" href = "/favicon-16x16.png" sizes = "16x16" >
< link rel = "icon" type = "image/png" href = "/favicon-32x32.png" sizes = "32x32" >
< meta name = "msapplication-TileColor" content = "#da532c" >
2014-10-02 19:13:33 -07:00
<!-- favicons -->
2013-06-29 21:15:46 -06:00
< meta name = "viewport" content = "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" >
2014-05-31 13:08:08 -07:00
< script src = "//code.jquery.com/jquery-latest.min.js" > < / script >
2013-08-03 14:05:39 -06:00
< script src = "//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js" > < / script >
2014-05-31 13:08:08 -07:00
< script src = "//use.typekit.net/hse2lqc.js" > < / script >
2013-08-03 22:02:01 -06:00
< script >
try{Typekit.load();}catch(e){} script(src='js/bootstrap.min.js')
< / script >
2013-06-29 21:15:46 -06:00
< link rel = "stylesheet" href = "css/styles.css" >
2013-08-03 18:00:17 -06:00
< script >
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-547519-12', 'erikflowers.github.io');
ga('send', 'pageview');
< / script >
2013-06-29 21:15:46 -06:00
< / head >
2013-08-03 14:05:39 -06:00
< body >
2013-06-29 21:15:46 -06:00
< header >
< div class = "container" >
< div class = "row-fluid" >
< div class = "col-sm-12" >
< h1 > Weather Icons< / h1 >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-cloudy" > < / i > < / div >
2013-06-29 21:15:46 -06:00
< / div >
< / div >
< / div >
< / header >
2013-08-03 14:05:39 -06:00
< section class = "content container intro" >
2013-06-29 21:15:46 -06:00
< div class = "row" >
< div class = "col-sm-12" >
2014-10-02 19:13:33 -07:00
< p class = "intro-icons" > < i class = "wi wi-day-lightning" > < / i > < i class = "wi wi-night-thunderstorm" > < / i > < i class = "wi wi-day-snow" > < / i > < i class = "wi wi-sprinkles" > < / i > < i class = "wi wi-day-sunny" > < / i > < i class = "wi wi-cloudy" > < / i > < i class = "wi wi-night-rain-mix" > < / i > < i class = "wi wi-sunset" > < / i > < i class = "wi wi-sunrise" > < / i > < i class = "wi wi-day-cloudy-windy" > < / i > < i class = "wi wi-night-rain" > < / i > < i class = "wi wi-night-alt-snow" > < / i > < / p >
2014-11-30 15:52:49 -08:00
< p class = "headline" > Weather Icons is a font of 189 weather themed icons, ready to be dropped right into < a href = "http://getbootstrap.com" > Bootstrap< / a > or any other project. < i class = "wi wi-cloudy" > < / i > < / p >
2014-09-25 19:17:50 -07:00
< p > Inspired by < a href = "http://fontawesome.io/" > Font Awesome< / a > , they work in essentially the same way. They are infinitley scalable and any CSS that can be applied to text can be applied to them. All you need to do to insert an icon is add the class to an "i" element: < code > < i class="wi wi-day-lightning"> < /i> < / code > . At this time, there are no other effects/mixins to do advanced icon manipulation. Those will be coming in future releases. < / p >
2014-10-02 19:13:33 -07:00
< p class = "follow" > < a href = "https://twitter.com/weathericons" data-show-count = "false" data-size = "large" data-dnt = "true" class = "twitter-follow-button" > Follow @weathericons< / a >
< script > ! function ( d , s , id ) { var js , fjs = d . getElementsByTagName ( s ) [ 0 ] , p = /^http:/ . test ( d . location ) ? 'http' : 'https' ; if ( ! d . getElementById ( id ) ) { js = d . createElement ( s ) ; js . id = id ; js . src = p + '://platform.twitter.com/widgets.js' ; fjs . parentNode . insertBefore ( js , fjs ) ; } } ( document , 'script' , 'twitter-wjs' ) ; < / script >
< / p >
2013-08-03 14:05:39 -06:00
< / div >
< / div >
2013-08-03 18:00:17 -06:00
< / section >
< div class = "download-share" >
< div class = "container" >
< div class = "row download-here" >
2014-05-31 13:08:08 -07:00
< div class = "download-button" > < a href = "https://github.com/erikflowers/weather-icons" class = "download btn btn-primary btn-large" > Download version 1.2 < i class = "wi wi-cloud" > < / i > < / a > < / div >
2013-08-03 18:00:17 -06:00
< / div >
< div class = "row social" >
< div class = "col-sm-12" >
< p > < a href = "https://twitter.com/share" data-lang = "en" data-text = "Weather Icons - Bootstrap ready weather themed font icon!" data-via = "Erik_UX" data-count = "none" class = "twitter-share-button" > Tweet< / a >
< script >
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
< / script > < a href = "https://twitter.com/Erik_UX" data-show-count = "false" data-lang = "en" class = "twitter-follow-button" > Follow @Erik_UX< / a >
2014-05-31 13:08:08 -07:00
< script > ! function ( d , s , id ) { var js , fjs = d . getElementsByTagName ( s ) [ 0 ] ; if ( ! d . getElementById ( id ) ) { js = d . createElement ( s ) ; js . id = id ; js . src = "//platform.twitter.com/widgets.js" ; fjs . parentNode . insertBefore ( js , fjs ) ; } } ( document , "script" , "twitter-wjs" ) ; < / script > < a href = "https://twitter.com/artill" data-show-count = "false" data-lang = "en" class = "twitter-follow-button" > Follow @artill< / a >
< script > ! function ( d , s , id ) { var js , fjs = d . getElementsByTagName ( s ) [ 0 ] ; if ( ! d . getElementById ( id ) ) { js = d . createElement ( s ) ; js . id = id ; js . src = "//platform.twitter.com/widgets.js" ; fjs . parentNode . insertBefore ( js , fjs ) ; } } ( document , "script" , "twitter-wjs" ) ; < / script >
2014-10-02 19:25:48 -07:00
< iframe src = "http://ghbtns.com/github-btn.html?user=erikflowers&repo=weather-icons&type=fork&count=true" allowtransparency = "true" frameborder = "0" scrolling = "0" width = "75" height = "20" > < / iframe >
< iframe src = "http://ghbtns.com/github-btn.html?user=erikflowers&repo=weather-icons&type=watch&count=true" allowtransparency = "true" frameborder = "0" scrolling = "0" width = "73" height = "20" > < / iframe >
< iframe src = "http://ghbtns.com/github-btn.html?user=erikflowers&type=follow&count=true" allowtransparency = "true" frameborder = "0" scrolling = "0" width = "165" height = "20" > < / iframe >
2013-08-03 18:00:17 -06:00
< / p >
< / div >
2013-08-03 14:05:39 -06:00
< / div >
< / div >
2013-08-03 18:00:17 -06:00
< / div >
2013-08-03 14:05:39 -06:00
< section class = "content container iconExamples" >
2014-11-30 15:52:49 -08:00
< div class = "row" >
< div class = "col-sm-12" >
< h2 > New v1.3 Icons< / h2 >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-umbrella" > < / i > < / div >
< div class = "class" > wi-umbrella < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-day-windy" > < / i > < / div >
< div class = "class" > wi-day-windy < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-night-alt-cloudy" > < / i > < / div >
< div class = "class" > wi-night-alt-cloudy< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-up-left" > < / i > < / div >
< div class = "class" > wi-up-left < / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-down-right" > < / i > < / div >
< div class = "class" > wi-down-right < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-day-sleet" > < / i > < / div >
< div class = "class" > wi-day-sleet < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-night-sleet" > < / i > < / div >
< div class = "class" > wi-night-sleet < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-night-alt-sleet" > < / i > < / div >
< div class = "class" > wi-night-alt-sleet < / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-sleet" > < / i > < / div >
< div class = "class" > wi-sleet < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-day-haze" > < / i > < / div >
< div class = "class" > wi-day-haze < / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-12" >
< h3 > Moon Phases < / h3 >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-new" > < / i > < / div >
< div class = "class" > wi-moon-new < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-cresent-1" > < / i > < / div >
< div class = "class" > wi-moon-waxing-cresent-1 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-cresent-2" > < / i > < / div >
< div class = "class" > wi-moon-waxing-cresent-2 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-cresent-3" > < / i > < / div >
< div class = "class" > wi-moon-waxing-cresent-3 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-cresent-4" > < / i > < / div >
< div class = "class" > wi-moon-waxing-cresent-4 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-cresent-5" > < / i > < / div >
< div class = "class" > wi-moon-waxing-cresent-5 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-cresent-6" > < / i > < / div >
< div class = "class" > wi-moon-waxing-cresent-6 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-first-quarter" > < / i > < / div >
< div class = "class" > wi-moon-first-quarter < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-gibbous-1" > < / i > < / div >
< div class = "class" > wi-moon-waxing-gibbous-1 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-gibbous-2" > < / i > < / div >
< div class = "class" > wi-moon-waxing-gibbous-2 < / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-gibbous-3" > < / i > < / div >
< div class = "class" > wi-moon-waxing-gibbous-3 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-gibbous-4" > < / i > < / div >
< div class = "class" > wi-moon-waxing-gibbous-4 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-gibbous-5" > < / i > < / div >
< div class = "class" > wi-moon-waxing-gibbous-5 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waxing-gibbous-6" > < / i > < / div >
< div class = "class" > wi-moon-waxing-gibbous-6 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-full" > < / i > < / div >
< div class = "class" > wi-moon-full < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-gibbous-1" > < / i > < / div >
< div class = "class" > wi-moon-waning-gibbous-1 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-gibbous-2" > < / i > < / div >
< div class = "class" > wi-moon-waning-gibbous-2 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-gibbous-3" > < / i > < / div >
< div class = "class" > wi-moon-waning-gibbous-3 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-gibbous-4" > < / i > < / div >
< div class = "class" > wi-moon-waning-gibbous-4 < / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-gibbous-5" > < / i > < / div >
< div class = "class" > wi-moon-waning-gibbous-5 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-gibbous-6" > < / i > < / div >
< div class = "class" > wi-moon-waning-gibbous-6 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-3rd-quarter" > < / i > < / div >
< div class = "class" > wi-moon-3rd-quarter < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-crescent-1" > < / i > < / div >
< div class = "class" > wi-moon-waning-crescent-1 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-crescent-2" > < / i > < / div >
< div class = "class" > wi-moon-waning-crescent-2 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-crescent-3" > < / i > < / div >
< div class = "class" > wi-moon-waning-crescent-3 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-crescent-4" > < / i > < / div >
< div class = "class" > wi-moon-waning-crescent-4 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-crescent-5" > < / i > < / div >
< div class = "class" > wi-moon-waning-crescent-5 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-moon-waning-crescent-6" > < / i > < / div >
< div class = "class" > wi-moon-waning-crescent-6 < / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-12" >
< h3 > Clocks< / h3 >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-12" > < / i > < / div >
< div class = "class" > wi-time-12 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-1" > < / i > < / div >
< div class = "class" > wi-time-1 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-2" > < / i > < / div >
< div class = "class" > wi-time-2 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-3" > < / i > < / div >
< div class = "class" > wi-time-3 < / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-4" > < / i > < / div >
< div class = "class" > wi-time-4 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-5" > < / i > < / div >
< div class = "class" > wi-time-5 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-6" > < / i > < / div >
< div class = "class" > wi-time-6 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-7" > < / i > < / div >
< div class = "class" > wi-time-7 < / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-8" > < / i > < / div >
< div class = "class" > wi-time-8 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-9" > < / i > < / div >
< div class = "class" > wi-time-9 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-10" > < / i > < / div >
< div class = "class" > wi-time-10 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-time-11" > < / i > < / div >
< div class = "class" > wi-time-11 < / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-12" >
< h3 > Beafort Wind Scale< / h3 >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-0" > < / i > < / div >
< div class = "class" > wi-beafort-0 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-1" > < / i > < / div >
< div class = "class" > wi-beafort-1 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-2" > < / i > < / div >
< div class = "class" > wi-beafort-2 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-3" > < / i > < / div >
< div class = "class" > wi-beafort-3 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-4" > < / i > < / div >
< div class = "class" > wi-beafort-4 < / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-5" > < / i > < / div >
< div class = "class" > wi-beafort-5 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-6" > < / i > < / div >
< div class = "class" > wi-beafort-6 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-7" > < / i > < / div >
< div class = "class" > wi-beafort-7 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-8" > < / i > < / div >
< div class = "class" > wi-beafort-8 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-9" > < / i > < / div >
< div class = "class" > wi-beafort-9 < / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-10" > < / i > < / div >
< div class = "class" > wi-beafort-10 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-11" > < / i > < / div >
< div class = "class" > wi-beafort-11 < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-beafort-12" > < / i > < / div >
< div class = "class" > wi-beafort-12 < / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-12" >
< h3 > Wind Directions - 0 degrees through 345 degrees< / h3 >
< p > Wind direction icons use CSS3 tranform to rotate. Choose your interpretation; point to the wind source, or point in the wind direction. Example: pointing to an east wind would be wi-wind-default._90-deg, but pointing in the direction of an east wind would be wi-wind-default._270deg. This should give everyone the felxibility they need without having alias names or 24 separate glyphs.< / p >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _0-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._0-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _15-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._15-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _30-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._30-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _45-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._45-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _60-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._60-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _75-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._75-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _90-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._90-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _105-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._105-deg< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _120-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._120-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _135-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._135-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _150-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._150-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _165-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._165-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _180-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._180-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _195-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._195-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _210-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._210-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _225-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._225-deg< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _240-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._240-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _255-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._255-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _270-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._270-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _285-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._285-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _300-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._300-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _315-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._315-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _330-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._330-deg< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-wind-default _345-deg" > < / i > < / div >
< div class = "class" > wi-wind-default._345-deg< / div >
< / div >
< / div >
< / div >
2014-05-31 13:08:08 -07:00
< div class = "row" >
< div class = "col-sm-12" >
< h2 > New v1.2 < / h2 >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-smoke" > < / i > < / div >
< div class = "class" > wi-smoke< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-dust" > < / i > < / div >
< div class = "class" > wi-dust< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-snow-wind" > < / i > < / div >
< div class = "class" > wi-snow-wind< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-day-snow-wind" > < / i > < / div >
< div class = "class" > wi-day-snow-wind< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-night-snow-wind" > < / i > < / div >
< div class = "class" > wi-night-snow-wind< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-night-alt-snow-wind" > < / i > < / div >
< div class = "class" > wi-night-alt-snow-wind< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-day-sleet-storm" > < / i > < / div >
< div class = "class" > wi-day-sleet-storm< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-night-sleet-storm" > < / i > < / div >
< div class = "class" > wi-night-sleet-storm< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-night-alt-sleet-storm" > < / i > < / div >
< div class = "class" > wi-night-alt-sleet-storm< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-day-snow-thunderstorm" > < / i > < / div >
< div class = "class" > wi-day-snow-thunderstorm< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-night-snow-thunderstorm" > < / i > < / div >
< div class = "class" > wi-night-snow-thunderstorm< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-night-alt-snow-thunderstorm" > < / i > < / div >
< div class = "class" > wi-night-alt-snow-thunderstorm< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-solar-eclipse" > < / i > < / div >
< div class = "class" > wi-solar-eclipse< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-lunar-eclipse" > < / i > < / div >
< div class = "class" > wi-lunar-eclipse< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-meteor" > < / i > < / div >
< div class = "class" > wi-meteor< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-hot" > < / i > < / div >
< div class = "class" > wi-hot< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-hurricane" > < / i > < / div >
< div class = "class" > wi-hurricane < / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-smog" > < / i > < / div >
< div class = "class" > wi-smog< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-alien" > < / i > < / div >
< div class = "class" > wi-alien< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-snowflake-cold" > < / i > < / div >
< div class = "class" > wi-snowflake-cold< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-stars" > < / i > < / div >
< div class = "class" > wi-stars< / div >
< / div >
< div class = "example" >
< div class = "icon" > < i class = "wi wi-night-partly-cloudy" > < / i > < / div >
< div class = "class" > night-partly-cloudy< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
2014-11-30 15:52:49 -08:00
< div class = "class" > 1.2 Moons removed, see 1.3 update for all new moons< / div >
2014-05-31 13:08:08 -07:00
< / div >
< / div >
< / div >
2013-08-03 14:05:39 -06:00
< div class = "row" >
< div class = "col-sm-12" >
< h2 > Day / Sunny< / h2 >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-cloudy-gusts" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-cloudy-gusts< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-cloudy-windy" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-cloudy-windy< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-cloudy" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-cloudy< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-fog" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-fog< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-hail" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-hail< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-lightning" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-lightning< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-rain-mix" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-rain-mix< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-rain-wind" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-rain-wind< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-rain" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-rain< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-showers" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-showers< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-snow" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-snow< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-sprinkle" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-sprinkle< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-sunny-overcast" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-sunny-overcast< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-sunny" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-sunny< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-storm-showers" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-storm-showers< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-day-thunderstorm" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-day-thunderstorm< / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-12" >
< h2 > Neutral / Cloudy< / h2 >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-cloudy-gusts" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-cloudy-gusts< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-cloudy-windy" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-cloudy-windy< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-cloudy" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-cloudy< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-fog" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-fog< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-hail" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-hail< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-lightning" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-lightning< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-rain-mix" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-rain-mix< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-rain-wind" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-rain-wind< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-rain" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-rain< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-showers" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-showers< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-snow" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-snow< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-sprinkle" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-sprinkle< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-storm-showers" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-storm-showers< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-thunderstorm" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-thunderstorm< / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-12" >
< h2 > Night / Moons< / h2 >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-cloudy-gusts" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-cloudy-gusts< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-cloudy-windy" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-cloudy-windy< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-hail" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-hail< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-lightning" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-lightning< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-rain-mix" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-rain-mix< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-rain-wind" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-rain-wind< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-rain" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-rain< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-showers" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-showers< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-snow" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-snow< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-sprinkle" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-sprinkle< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-storm-showers" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-storm-showers< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-alt-thunderstorm" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-alt-thunderstorm< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-clear" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-clear< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-cloudy-gusts" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-cloudy-gusts< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-cloudy-windy" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-cloudy-windy< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-cloudy" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-cloudy< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-hail" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-hail< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-lightning" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-lightning< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-rain-mix" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-rain-mix< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-rain-wind" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-rain-wind< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-rain" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-rain< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-showers" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-showers< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-snow" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-snow< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-sprinkle" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-sprinkle< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-storm-showers" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-storm-showers< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-thunderstorm" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-thunderstorm< / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-12" >
< h2 > Miscellaneous Weather < / h2 >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-celsius" > < / i > < / div >
< div class = "class" > wi-celsius< / div >
2013-08-03 14:05:39 -06:00
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-cloud-down" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-cloud-down< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-cloud-refresh" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-cloud-refresh< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-cloud-up" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-cloud-up< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-cloud" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-cloud< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-degrees" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-degrees< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-down-left" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-down-left< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-down" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-down< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-fahrenheit" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-fahrenheit< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-horizon-alt" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-horizon-alt< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-horizon" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-horizon< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-left" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-left< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-lightning" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-lightning< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-night-fog" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-night-fog< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-refresh-alt" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-refresh-alt< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-refresh" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-refresh< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-right" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-right< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-sprinkles" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-sprinkles< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-strong-wind" > < / i > < / div >
2013-08-04 13:36:08 -06:00
< div class = "class" > wi-strong-wind< / div >
2013-08-03 14:05:39 -06:00
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-sunrise" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-sunrise< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-sunset" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-sunset< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-thermometer-exterior" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-thermometer-exterior< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-thermometer-internal" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-thermometer-internal< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-thermometer" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-thermometer< / div >
< / div >
< / div >
< div class = "col-sm-4" >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-tornado" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-tornado< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-up-right" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-up-right< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-up" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-up< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-wind-east" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-wind-east< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-wind-north-east" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-wind-north-east< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-wind-north-west" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-wind-north-west< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-wind-north" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-wind-north< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-wind-south-east" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-wind-south-east< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-wind-south-west" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-wind-south-west< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-wind-south" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-wind-south< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-wind-west" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-wind-west< / div >
< / div >
< div class = "example" >
2014-05-31 13:08:08 -07:00
< div class = "icon" > < i class = "wi wi-windy" > < / i > < / div >
2013-08-03 14:05:39 -06:00
< div class = "class" > wi-windy< / div >
2013-06-29 21:15:46 -06:00
< / div >
< / div >
< / div >
< / section >
2013-08-03 18:00:17 -06:00
< div class = "container" >
< div class = "row" >
< div class = "col-sm-12" >
< div class = "beta" >
2014-05-31 13:08:08 -07:00
< div class = "title" > Version 1.2< / div >
< p > The second release of Weather Icons with streamlined, updated Less, customizable variables, adjusted font boundaries, and all new fonts including: < / p >
< p > Please report any issues or requests to the < a href = "https://github.com/erikflowers/weather-icons/issues" > repository here< / a > < / p >
2014-11-30 15:52:49 -08:00
< p > The icon designs are originally by < a href = "https://twitter.com/artill" > Lukas Bischoff. < / a > The font has wi-been modified slightly for icon-font usage, and turned into a HTML/CSS/LESS addon by < a href = "http://www.helloerik.com/" > me (Erik).< / a > < / p >
2013-08-03 18:00:17 -06:00
< / div >
< / div >
< / div >
< / div >
2013-06-29 21:15:46 -06:00
< footer >
< div class = "container" >
2013-08-03 18:42:15 -06:00
< div class = "row" >
2014-10-02 19:13:33 -07:00
< div class = "col-sm-12" >
2013-08-03 14:05:39 -06:00
< p > The Weather Icons project created and maintained by < a href = "http://www.twitter.com/Erik_UX" > Erik Flowers< / a > . Original artwork by < a href = "http://www.twitter.com/artill" > Lukas Bischoff.< / a > < / p >
< p > LESS/HTML implementation inspired and heavily influenced by < a href = "http://fortawesome.github.io/Font-Awesome/" > Font Awesome.< / a > < / p >
< p > Weather Icons licensed under < a http: / / scripts . sil . org / OFL > SIL OFL 1.1< / a > — Code licensed under < a http: / / opensource . org / licenses / mit-license . html > MIT License< / a > — Documentation licensed under < a http: / / creativecommons . org / licenses / by / 3 . 0 / > CC BY 3.0< / a > < / p >
< / div >
2013-06-29 21:15:46 -06:00
< / div >
< / div >
< / footer >
< / body >
2014-11-30 15:52:49 -08:00
< / html >
