Basic Usage
The App Weather API returns icon identifiers that correspond to the open-source licensed Weather Icons font set.
To use the Weather Icons on a website, download and extract the zip file linked above. Save the “css” and “font” folders to your website source directory. IMPORTANT: the “css” and “font” folders must exist as siblings within the same directory. Add a Weather Icons CSS file stylesheet link to the <head> section for your website :
<link rel="stylesheet" type="text/css" href="path/to/css/weather-icons.min.css">
To place a weather icon on your webpage, add:
<i class="wi {{icon}}"></i>
Replace {{icon}} with the icon string returned by the App Weather API (i.e. “wi-day-sunny”), and format as desired via CSS.
Icon Identifiers
The App Weather API returns the following weather icon identifiers:
- wi-day-cloudy
- wi-day-cloudy-gusts
- wi-day-cloudy-windy
- wi-day-light-wind
- wi-day-rain
- wi-day-showers
- wi-day-snow
- wi-day-sprinkle
- wi-day-sunny
- wi-day-sunny-overcast
- wi-day-windy
- wi-night-alt-cloudy
- wi-night-alt-cloudy-gusts
- wi-night-alt-cloudy-windy
- wi-night-alt-partly-cloudy
- wi-night-alt-rain
- wi-night-alt-showers
- wi-night-alt-snow
- wi-night-alt-sprinkle
- wi-night-clear
- wi-rain
- wi-showers
- wi-snow
- wi-sprinkle
- wi-strong-wind
- wi-windy