{"id":13578136,"url":"https://github.com/bramkragten/weather-card","last_synced_at":"2025-04-05T18:04:57.758Z","repository":{"id":40743890,"uuid":"192732636","full_name":"bramkragten/weather-card","owner":"bramkragten","description":"Weather Card with animated icons for Home Assistant Lovelace","archived":false,"fork":false,"pushed_at":"2024-05-04T21:40:37.000Z","size":1398,"stargazers_count":522,"open_issues_count":103,"forks_count":173,"subscribers_count":20,"default_branch":"master","last_synced_at":"2025-03-29T17:25:22.301Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bramkragten.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["bramkragten"]}},"created_at":"2019-06-19T12:58:15.000Z","updated_at":"2025-03-27T22:43:51.000Z","dependencies_parsed_at":"2023-12-09T23:19:49.441Z","dependency_job_id":"adcc53a2-6f7d-4a76-82e7-c8e1b2313901","html_url":"https://github.com/bramkragten/weather-card","commit_stats":null,"previous_names":[],"tags_count":15,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bramkragten%2Fweather-card","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bramkragten%2Fweather-card/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bramkragten%2Fweather-card/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bramkragten%2Fweather-card/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bramkragten","download_url":"https://codeload.github.com/bramkragten/weather-card/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247378135,"owners_count":20929296,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-01T15:01:27.789Z","updated_at":"2025-04-05T18:04:57.740Z","avatar_url":"https://github.com/bramkragten.png","language":null,"funding_links":["https://github.com/sponsors/bramkragten"],"categories":["Others","Install from Source","Dashboards"],"sub_categories":["Smart Home Automation","Custom Cards"],"readme":"# Lovelace animated weather card\n\nOriginally created for the [old UI](https://community.home-assistant.io/t/custom-ui-weather-state-card-with-a-question/23008) converted by @arsaboo and @ciotlosm to [Lovelace](https://community.home-assistant.io/t/custom-ui-weather-state-card-with-a-question/23008/291) and now converted to Lit to make it even better.\n\nThis card uses the awesome [animated SVG weather icons by amCharts](https://www.amcharts.com/free-animated-svg-weather-icons/).\n\n![Weather Card](https://github.com/bramkragten/custom-ui/blob/master/weather-card/weather-card.gif?raw=true)\n\nThanks for all picking this card up.\n\n## Installation:\n\nYou have 2 options, hosted or self hosted (manual). The first option needs internet and will update itself.\n\n# Hosted:\n\nAdd the following to resources in your lovelace config:\n\n```yaml\n- url: https://cdn.jsdelivr.net/gh/bramkragten/weather-card/dist/weather-card.min.js\n  type: module\n```\n\n# Manual:\n\n1. Download the [weather-card.js](https://raw.githubusercontent.com/bramkragten/weather-card/v1.2.0/dist/weather-card.js) to `/config/www/custom-lovelace/weather-card/`. (or an other folder in `/config/www/`)\n2. Save, the [amCharts icons](https://www.amcharts.com/free-animated-svg-weather-icons/) (The contents of the folder \"animated\") under `/config/www/custom-lovelace/weather-card/icons/` (or an other folder in `/config/www/`)\n3. If you use Lovelace in storage mode, and want to use the editor, download the [weather-card-editor.js](https://raw.githubusercontent.com/bramkragten/weather-card/v1.2.0/dist/weather-card-editor.js) to `/config/www/custom-lovelace/weather-card/`. (or the folder you used above)\n\nAdd the following to resources in your lovelace config:\n\n```yaml\nresources:\n  - url: /local/custom-lovelace/weather-card/weather-card.js\n    type: module\n```\n\n## Configuration:\n\nAnd add a card with type `custom:weather-card`:\n\n```yaml\ntype: custom:weather-card\nentity: weather.yourweatherentity\nname: Optional name\n```\n\nIf you want to use your local icons add the location to the icons:\n\n```yaml\ntype: custom:weather-card\nentity: weather.yourweatherentity\nicons: \"/local/custom-lovelace/weather-card/icons/\"\n```\n\nYou can choose wich elements of the weather card you want to show:\n\nThe 3 different rows, being:\n\n- The current weather icon, the current temperature and title\n- The details about the current weather\n- The X day forecast or hourly forecast\n\n```yaml\ntype: custom:weather-card\nentity: weather.yourweatherentity\ncurrent: true\ndetails: false\nforecast: true\nhourly_forecast: false\nnumber_of_forecasts: 5\n```\n\nIf you want to show the sunrise and sunset times, make sure the `sun` component is enabled:\n\n```yaml\n# Example configuration.yaml entry\nsun:\n```\n\n### Dark Sky:\n\nWhen using Dark Sky you should put the mode to `daily` if you want a daily forecast with highs and lows.\n\n```yaml\n# Example configuration.yaml entry\nweather:\n  - platform: darksky\n    api_key: YOUR_API_KEY\n    mode: daily\n```\n\n### OpenWeather Map:\n\nWhen using OpenWeather map you can select hourly(default) or daily forecast to show.\n\n```yaml\n# Example configuration.yaml entry\nweather:\n  - platform: openweathermap\n    api_key: YOUR_API_KEY\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbramkragten%2Fweather-card","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbramkragten%2Fweather-card","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbramkragten%2Fweather-card/lists"}