# Weather Svg Creator

> Weather Svg Creator

- Skill: `shanraisshan/weather-svg-creator` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add shanraisshan/weather-svg-creator`
- Raw SKILL.md: https://api.skillmd.com/api/skills/shanraisshan/weather-svg-creator/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools, AI & ML
- Author: shanraisshan (https://skillmd.com/u/shanraisshan)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/shanraisshan/weather-svg-creator

---


# Weather SVG Creator Skill

This skill creates an SVG weather card from provided temperature data.

## Task

Create an SVG weather card displaying the temperature for a given city and write it to the output files.

## Instructions

You will receive the temperature value, unit (Celsius or Fahrenheit), and city name from the calling context.

### 1. Create SVG Weather Card

Generate a clean SVG weather card with the following structure:

```svg
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 200" width="400" height="200">
  <rect width="400" height="200" rx="12" fill="#1a1a2e"/>
  <text x="200" y="50" text-anchor="middle" fill="#e0e0e0" font-family="system-ui" font-size="16">[City Name]</text>
  <text x="200" y="110" text-anchor="middle" fill="white" font-family="system-ui" font-size="48" font-weight="bold">[value]°[C/F]</text>
  <text x="200" y="150" text-anchor="middle" fill="#888" font-family="system-ui" font-size="12">[Current date and time]</text>
  <text x="200" y="185" text-anchor="middle" fill="#555" font-family="system-ui" font-size="10">Weather data from Open-Meteo API</text>
</svg>
```

Replace `[value]`, `[C/F]`, `[City Name]` with actual values from the input.

### 2. Write Output Files

Write the SVG content to `orchestration-workflow/weather.svg`.

Also write a markdown summary to `orchestration-workflow/output.md`:

```markdown
# Weather Report

![Weather Card](weather.svg)

**Location**: [City Name]
**Temperature**: [value]°[C/F]
**Fetched At**: [Current date and time in ISO 8601 format]

> Weather data provided by [Open-Meteo API](https://open-meteo.com/)
```

- Create the `orchestration-workflow/` directory if it does not exist
- Overwrite any existing content

## Expected Input

Temperature value, unit, and city from the calling agent:
```
Temperature: [X]°[C/F]
City: [City Name]
Unit: [Celsius/Fahrenheit]
```

## Expected Output

Two files written:
- `orchestration-workflow/weather.svg` — SVG weather card
- `orchestration-workflow/output.md` — Markdown report embedding the SVG

## Notes

- Use the exact temperature value and unit provided — do not re-fetch or modify the data
- Keep the SVG design minimal and clean
- Include a timestamp so the report is traceable
- Output files go in the `orchestration-workflow/` directory