weather_icons_animated 0.0.2 copy "weather_icons_animated: ^0.0.2" to clipboard
weather_icons_animated: ^0.0.2 copied to clipboard

Flutter package for Meteocons weather icons with animated SVG, static SVG, outlined monochrome SVG, and Lottie assets.

weather_icons_animated #

Flutter package pub.dev Meteocons

Flutter package for the Meteocons weather icon set by Bas Milius, bundled for Flutter with SVG and Lottie support.

This package includes the upstream production assets from basmilius/weather-icons and exposes a small API for resolving or rendering icons in Flutter apps.

What is included #

  • Filled animated SVG icons
  • Filled static SVG icons
  • Filled Lottie animations
  • Line animated SVG icons
  • Line static SVG icons
  • Line Lottie animations where available
  • Monochrome static SVG icons
  • Open-Meteo / WMO weather-code to icon mapping

Installation #

dependencies:
  weather_icons_animated: ^0.0.2

Usage #

import 'package:flutter/material.dart';
import 'package:weather_icons_animated/weather_icons_animated.dart';

class WeatherTile extends StatelessWidget {
  const WeatherTile({super.key});

  @override
  Widget build(BuildContext context) {
    return const WeatherIcon(
      icon: WeatherIcons.named('partly-cloudy-day'),
      style: WeatherIconStyle.line,
      format: WeatherIconFormat.svgAnimated,
      size: 72,
    );
  }
}

You can also resolve asset paths directly:

final asset = WeatherIcons.named('wind').resolve(
  style: WeatherIconStyle.line,
  format: WeatherIconFormat.lottie,
);

print(asset.path);
// assets/line/lottie/wind.json

Weather-code support #

The package can also map Open-Meteo / WMO weather codes to icon slugs so your app can work directly from forecast API responses.

final icon = WeatherIcons.fromOpenMeteoCode(0, isDay: true);

const widget = WeatherIcon(
  icon: WeatherIcons.fromOpenMeteoCode(61),
  style: WeatherIconStyle.fill,
  format: WeatherIconFormat.svgAnimated,
  size: 64,
);

Supported mapping:

Weather code(s) Meaning Icon mapping
0 Clear sky clear-day or clear-night when isDay is provided
1, 2 Mainly clear / partly cloudy partly-cloudy-day or partly-cloudy-night when isDay is provided
3 Overcast overcast
45, 48 Fog / depositing rime fog fog-day, fog-night, or fog
51, 53, 55 Drizzle drizzle
56, 57, 66, 67 Freezing drizzle / freezing rain sleet
61, 63, 65, 80, 81, 82 Rain / rain showers rain
71, 73, 75, 77, 85, 86 Snow / snow grains / snow showers snow
95 Thunderstorm thunderstorms
96, 99 Thunderstorm with hail thunderstorms-extreme

If the exact asset combination is unavailable, resolution falls back by default:

  • line + lottie falls back to animated SVG when that icon has no line Lottie file
  • monochrome falls back to static SVG

Pass fallback: false to throw instead of falling back.

Asset layout #

  • assets/fill/svg/
  • assets/fill/svg-static/
  • assets/fill/lottie/
  • assets/line/svg/
  • assets/line/svg-static/
  • assets/line/lottie/
  • assets/monochrome/svg-static/

Docs website #

This repository also includes a publishable static docs site:

  • Page source: website/index.html
  • Generated dataset: website/data.js
  • GitHub Pages workflow: .github/workflows/deploy-docs.yml

The site is plain HTML with Tailwind via CDN, plus local package assets copied into the Pages artifact by the workflow. Once GitHub Pages is enabled for the repository, pushes to main that touch website/, assets/, or the workflow will deploy the docs site.

Icon availability table #

Preview icons below are rendered from the upstream /fill/svg/ animated SVG files so the catalog stays visually browsable in Markdown.

Availability markers:

  • available

  • unavailable

  • Total icon slugs: 236

  • Full coverage in fill SVG, fill static SVG, fill Lottie, line SVG, line static SVG, and monochrome static SVG: 236

  • Line Lottie coverage: 73

Preview Icon Fill SVG Fill Static Fill Lottie Line SVG Line Static Line Lottie Monochrome Static
alert-avalanche-danger alert-avalanche-danger yes yes
alert-falling-rocks alert-falling-rocks yes yes
barometer barometer yes yes
beanie beanie yes yes
celsius celsius yes yes
clear-day clear-day yes yes
clear-night clear-night yes yes
cloud-down cloud-down yes yes
cloud-up cloud-up yes yes
cloudy cloudy yes yes
code-green code-green yes yes
code-orange code-orange yes yes
code-red code-red yes yes
code-yellow code-yellow yes yes
compass compass yes yes
drizzle drizzle yes yes
dust dust yes yes
dust-day dust-day yes yes
dust-night dust-night yes yes
dust-wind dust-wind yes yes
extreme extreme yes yes
extreme-day extreme-day yes yes
extreme-day-drizzle extreme-day-drizzle yes yes
extreme-day-fog extreme-day-fog yes yes
extreme-day-hail extreme-day-hail yes yes
extreme-day-haze extreme-day-haze yes yes
extreme-day-rain extreme-day-rain yes yes
extreme-day-sleet extreme-day-sleet yes yes
extreme-day-smoke extreme-day-smoke yes yes
extreme-day-snow extreme-day-snow yes yes
extreme-drizzle extreme-drizzle yes yes
extreme-fog extreme-fog yes yes
extreme-hail extreme-hail yes yes
extreme-haze extreme-haze yes yes
extreme-night extreme-night yes yes
extreme-night-drizzle extreme-night-drizzle yes yes
extreme-night-fog extreme-night-fog yes yes
extreme-night-hail extreme-night-hail yes yes
extreme-night-haze extreme-night-haze yes yes
extreme-night-rain extreme-night-rain yes yes
extreme-night-sleet extreme-night-sleet yes yes
extreme-night-smoke extreme-night-smoke yes yes
extreme-night-snow extreme-night-snow yes yes
extreme-rain extreme-rain yes yes
extreme-sleet extreme-sleet yes yes
extreme-smoke extreme-smoke yes yes
extreme-snow extreme-snow yes yes
fahrenheit fahrenheit yes yes
falling-stars falling-stars yes yes
flag-gale-warning flag-gale-warning yes yes
flag-hurricane-warning flag-hurricane-warning yes yes
flag-small-craft-advisory flag-small-craft-advisory yes yes
flag-storm-warning flag-storm-warning yes yes
fog fog yes yes
fog-day fog-day yes yes
fog-night fog-night yes yes
glove glove yes yes
hail hail yes yes
haze haze yes yes
haze-day haze-day yes yes
haze-night haze-night yes yes
horizon horizon yes yes
humidity humidity yes yes
hurricane hurricane yes yes
lightning-bolt lightning-bolt yes yes
mist mist yes yes
moon-first-quarter moon-first-quarter yes yes
moon-full moon-full yes yes
moon-last-quarter moon-last-quarter yes yes
moon-new moon-new yes yes
moon-waning-crescent moon-waning-crescent yes yes
moon-waning-gibbous moon-waning-gibbous yes yes
moon-waxing-crescent moon-waxing-crescent yes yes
moon-waxing-gibbous moon-waxing-gibbous yes yes
moonrise moonrise yes yes
moonset moonset yes yes
not-available not-available yes yes
overcast overcast yes yes
overcast-day overcast-day yes yes
overcast-day-drizzle overcast-day-drizzle yes yes
overcast-day-fog overcast-day-fog yes yes
overcast-day-hail overcast-day-hail yes yes
overcast-day-haze overcast-day-haze yes yes
overcast-day-rain overcast-day-rain yes yes
overcast-day-sleet overcast-day-sleet yes yes
overcast-day-smoke overcast-day-smoke yes yes
overcast-day-snow overcast-day-snow yes yes
overcast-drizzle overcast-drizzle yes yes
overcast-fog overcast-fog yes yes
overcast-hail overcast-hail yes yes
overcast-haze overcast-haze yes yes
overcast-night overcast-night yes yes
overcast-night-drizzle overcast-night-drizzle yes yes
overcast-night-fog overcast-night-fog yes yes
overcast-night-hail overcast-night-hail yes yes
overcast-night-haze overcast-night-haze yes yes
overcast-night-rain overcast-night-rain yes yes
overcast-night-sleet overcast-night-sleet yes yes
overcast-night-smoke overcast-night-smoke yes yes
overcast-night-snow overcast-night-snow yes yes
overcast-rain overcast-rain yes yes
overcast-sleet overcast-sleet yes yes
overcast-smoke overcast-smoke yes yes
overcast-snow overcast-snow yes yes
partly-cloudy-day partly-cloudy-day yes yes
partly-cloudy-day-drizzle partly-cloudy-day-drizzle yes yes
partly-cloudy-day-fog partly-cloudy-day-fog yes yes
partly-cloudy-day-hail partly-cloudy-day-hail yes yes
partly-cloudy-day-haze partly-cloudy-day-haze yes yes
partly-cloudy-day-rain partly-cloudy-day-rain yes yes
partly-cloudy-day-sleet partly-cloudy-day-sleet yes yes
partly-cloudy-day-smoke partly-cloudy-day-smoke yes yes
partly-cloudy-day-snow partly-cloudy-day-snow yes yes
partly-cloudy-night partly-cloudy-night yes yes
partly-cloudy-night-drizzle partly-cloudy-night-drizzle yes yes
partly-cloudy-night-fog partly-cloudy-night-fog yes yes
partly-cloudy-night-hail partly-cloudy-night-hail yes yes
partly-cloudy-night-haze partly-cloudy-night-haze yes yes
partly-cloudy-night-rain partly-cloudy-night-rain yes yes
partly-cloudy-night-sleet partly-cloudy-night-sleet yes yes
partly-cloudy-night-smoke partly-cloudy-night-smoke yes yes
partly-cloudy-night-snow partly-cloudy-night-snow yes yes
pollen pollen yes yes
pollen-flower pollen-flower yes yes
pollen-grass pollen-grass yes yes
pollen-tree pollen-tree yes yes
pressure-high pressure-high yes yes
pressure-high-alt pressure-high-alt yes yes
pressure-low pressure-low yes yes
pressure-low-alt pressure-low-alt yes yes
rain rain yes yes
rainbow rainbow yes yes
rainbow-clear rainbow-clear yes yes
raindrop raindrop yes yes
raindrop-measure raindrop-measure yes yes
raindrops raindrops yes yes
sleet sleet yes yes
smoke smoke yes yes
smoke-particles smoke-particles yes yes
snow snow yes yes
snowflake snowflake yes yes
snowman snowman yes yes
solar-eclipse solar-eclipse yes yes
star star yes yes
starry-night starry-night yes yes
sun-hot sun-hot yes yes
sunrise sunrise yes yes
sunset sunset yes yes
thermometer thermometer yes yes
thermometer-celsius thermometer-celsius yes yes
thermometer-colder thermometer-colder yes yes
thermometer-fahrenheit thermometer-fahrenheit yes yes
thermometer-glass thermometer-glass yes yes
thermometer-glass-celsius thermometer-glass-celsius yes yes
thermometer-glass-fahrenheit thermometer-glass-fahrenheit yes yes
thermometer-mercury thermometer-mercury yes yes
thermometer-mercury-cold thermometer-mercury-cold yes yes
thermometer-moon thermometer-moon yes yes
thermometer-raindrop thermometer-raindrop yes yes
thermometer-snow thermometer-snow yes yes
thermometer-sun thermometer-sun yes yes
thermometer-warmer thermometer-warmer yes yes
thermometer-water thermometer-water yes yes
thunderstorms thunderstorms yes yes yes
thunderstorms-day thunderstorms-day yes yes yes
thunderstorms-day-extreme thunderstorms-day-extreme yes yes yes
thunderstorms-day-extreme-rain thunderstorms-day-extreme-rain yes yes yes
thunderstorms-day-extreme-snow thunderstorms-day-extreme-snow yes yes yes
thunderstorms-day-overcast thunderstorms-day-overcast yes yes yes
thunderstorms-day-overcast-rain thunderstorms-day-overcast-rain yes yes yes
thunderstorms-day-overcast-snow thunderstorms-day-overcast-snow yes yes yes
thunderstorms-day-rain thunderstorms-day-rain yes yes yes
thunderstorms-day-snow thunderstorms-day-snow yes yes yes
thunderstorms-extreme thunderstorms-extreme yes yes yes
thunderstorms-extreme-rain thunderstorms-extreme-rain yes yes yes
thunderstorms-extreme-snow thunderstorms-extreme-snow yes yes yes
thunderstorms-night thunderstorms-night yes yes yes
thunderstorms-night-extreme thunderstorms-night-extreme yes yes yes
thunderstorms-night-extreme-rain thunderstorms-night-extreme-rain yes yes yes
thunderstorms-night-extreme-snow thunderstorms-night-extreme-snow yes yes yes
thunderstorms-night-overcast thunderstorms-night-overcast yes yes yes
thunderstorms-night-overcast-rain thunderstorms-night-overcast-rain yes yes yes
thunderstorms-night-overcast-snow thunderstorms-night-overcast-snow yes yes yes
thunderstorms-night-rain thunderstorms-night-rain yes yes yes
thunderstorms-night-snow thunderstorms-night-snow yes yes yes
thunderstorms-overcast thunderstorms-overcast yes yes yes
thunderstorms-overcast-rain thunderstorms-overcast-rain yes yes yes
thunderstorms-overcast-snow thunderstorms-overcast-snow yes yes yes
thunderstorms-rain thunderstorms-rain yes yes yes
thunderstorms-snow thunderstorms-snow yes yes yes
tide-high tide-high yes yes yes
tide-low tide-low yes yes yes
time-afternoon time-afternoon yes yes yes
time-evening time-evening yes yes yes
time-late-afternoon time-late-afternoon yes yes yes
time-late-evening time-late-evening yes yes yes
time-late-morning time-late-morning yes yes yes
time-late-night time-late-night yes yes yes
time-morning time-morning yes yes yes
time-night time-night yes yes yes
tornado tornado yes yes yes
umbrella umbrella yes yes yes
umbrella-wind umbrella-wind yes yes yes
umbrella-wind-alt umbrella-wind-alt yes yes yes
uv-index uv-index yes yes yes
uv-index-1 uv-index-1 yes yes yes
uv-index-10 uv-index-10 yes yes yes
uv-index-11 uv-index-11 yes yes yes
uv-index-2 uv-index-2 yes yes yes
uv-index-3 uv-index-3 yes yes yes
uv-index-4 uv-index-4 yes yes yes
uv-index-5 uv-index-5 yes yes yes
uv-index-6 uv-index-6 yes yes yes
uv-index-7 uv-index-7 yes yes yes
uv-index-8 uv-index-8 yes yes yes
uv-index-9 uv-index-9 yes yes yes
wind wind yes yes yes
wind-alert wind-alert yes yes yes
wind-beaufort-0 wind-beaufort-0 yes yes yes
wind-beaufort-1 wind-beaufort-1 yes yes yes
wind-beaufort-10 wind-beaufort-10 yes yes yes
wind-beaufort-11 wind-beaufort-11 yes yes yes
wind-beaufort-12 wind-beaufort-12 yes yes yes
wind-beaufort-2 wind-beaufort-2 yes yes yes
wind-beaufort-3 wind-beaufort-3 yes yes yes
wind-beaufort-4 wind-beaufort-4 yes yes yes
wind-beaufort-5 wind-beaufort-5 yes yes yes
wind-beaufort-6 wind-beaufort-6 yes yes yes
wind-beaufort-7 wind-beaufort-7 yes yes yes
wind-beaufort-8 wind-beaufort-8 yes yes yes
wind-beaufort-9 wind-beaufort-9 yes yes yes
wind-offshore wind-offshore yes yes yes
wind-onshore wind-onshore yes yes yes
wind-snow wind-snow yes yes yes
windsock windsock yes yes yes
windsock-weak windsock-weak yes yes yes

Attribution #

All bundled icons come from Bas Milius' Meteocons project and remain subject to the upstream MIT license. Keep the original license notice when redistributing this package or its assets.

1
likes
160
points
109
downloads

Documentation

Documentation
API reference

Publisher

unverified uploader

Weekly Downloads

Flutter package for Meteocons weather icons with animated SVG, static SVG, outlined monochrome SVG, and Lottie assets.

Repository (GitHub)
View/report issues

Topics

#weather #icons #svg #lottie #flutter

License

MIT (license)

Dependencies

flutter, flutter_svg, lottie

More

Packages that depend on weather_icons_animated