weather-svg-creator

Creates an SVG weather card showing the current temperature for Dubai. Writes the SVG to orchestration-workflow/weather.svg and updates orchestration-workflow/output.md.

30 stars

Best use case

weather-svg-creator is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Creates an SVG weather card showing the current temperature for Dubai. Writes the SVG to orchestration-workflow/weather.svg and updates orchestration-workflow/output.md.

Teams using weather-svg-creator should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/weather-svg-creator/SKILL.md --create-dirs "https://raw.githubusercontent.com/Zidong-IA/BIBLIOTECA/main/references/repos-referencia/claude-code-best-practice/.claude/skills/weather-svg-creator/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/weather-svg-creator/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How weather-svg-creator Compares

Feature / Agentweather-svg-creatorStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Creates an SVG weather card showing the current temperature for Dubai. Writes the SVG to orchestration-workflow/weather.svg and updates orchestration-workflow/output.md.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# Weather SVG Creator Skill

This skill creates a visual SVG weather card and writes the output files.

## Task

Create an SVG weather card displaying the temperature for Dubai, UAE, and write it along with a summary to output files.

## Instructions

You will receive the temperature value and unit (Celsius or Fahrenheit) 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 300 160" width="300" height="160">
  <rect width="300" height="160" rx="12" fill="#1a1a2e"/>
  <text x="150" y="45" text-anchor="middle" fill="#8892b0" font-family="system-ui" font-size="14">Unit: [Celsius/Fahrenheit]</text>
  <text x="150" y="100" text-anchor="middle" fill="#ccd6f6" font-family="system-ui" font-size="42" font-weight="bold">[value]°[C/F]</text>
  <text x="150" y="140" text-anchor="middle" fill="#64ffda" font-family="system-ui" font-size="16">Dubai, UAE</text>
</svg>
```

Replace `[Celsius/Fahrenheit]`, `[value]`, and `[C/F]` with actual values.

### 2. Write SVG File

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

### 3. Write Output Summary

Write to `orchestration-workflow/output.md`:

```markdown
# Weather Result

## Temperature
[value]°[C/F]

## Location
Dubai, UAE

## Unit
[Celsius/Fahrenheit]

## SVG Card
![Weather Card](weather.svg)
```

## Expected Input

Temperature value and unit from the weather-agent:
```
Temperature: [X]°[C/F]
Unit: [Celsius/Fahrenheit]
```

## Notes

- Use the exact temperature value and unit provided - do not re-fetch or modify
- The SVG should be a self-contained, valid SVG file
- Keep the design minimal and clean
- Both output files go in the `orchestration-workflow/` directory

Related Skills

content-creator

30
from Zidong-IA/BIBLIOTECA

Create SEO-optimized marketing content with consistent brand voice. Includes brand voice analyzer, SEO optimizer, content frameworks, and social media templates. Use when writing blog posts, creati...

slack-gif-creator

30
from Zidong-IA/BIBLIOTECA

Knowledge and utilities for creating animated GIFs optimized for Slack. Provides constraints, validation tools, and animation concepts. Use when users request animated GIFs for Slack like "...

skill-creator

30
from Zidong-IA/BIBLIOTECA

This skill should be used when the user asks to create a new skill, build a skill, make a custom skill, develop a CLI skill, or wants to extend the CLI with new capabilities. Automates the entire s...

skill-creator-ms

30
from Zidong-IA/BIBLIOTECA

Guide for creating effective skills for AI coding agents working with Azure SDKs and Microsoft Foundry services. Use when creating new skills or updating existing skills.

github-issue-creator

30
from Zidong-IA/BIBLIOTECA

Convert raw notes, error logs, voice dictation, or screenshots into crisp GitHub-flavored markdown issue reports. Use when the user pastes bug info, error messages, or informal descriptions and wan...

obsidian-clipper-template-creator

30
from Zidong-IA/BIBLIOTECA

Guide for creating templates for the Obsidian Web Clipper. Use when you want to create a new clipping template, understand available variables, or format clipped content.

weather-fetcher

30
from Zidong-IA/BIBLIOTECA

Instructions for fetching current weather temperature data for Dubai, UAE from Open-Meteo API

firecrawl

30
from Zidong-IA/BIBLIOTECA

Official Firecrawl CLI skill for web scraping, search, crawling, and browser automation. Returns clean LLM-optimized markdown. USE FOR: - Web search and research - Scraping pages, docs, and articles - Site mapping and bulk content extraction - Browser automation for interactive pages Must be pre-installed and authenticated. See rules/install.md for setup, rules/security.md for output handling.

super-search

30
from Zidong-IA/BIBLIOTECA

Search your coding memory. Use when user asks about past work, previous sessions, how something was implemented, what they worked on before, or wants to recall information from earlier sessions.

super-save

30
from Zidong-IA/BIBLIOTECA

Save important project knowledge to memory. Use when user wants to preserve architectural decisions, significant bug fixes, design patterns, or important implementation details for team reference.

zustand-store-ts

30
from Zidong-IA/BIBLIOTECA

Create Zustand stores with TypeScript, subscribeWithSelector middleware, and proper state/action separation. Use when building React state management, creating global stores, or implementing reacti...

web-quality-audit

30
from Zidong-IA/BIBLIOTECA

Comprehensive web quality audit covering performance, accessibility, SEO, and best practices. Use when asked to "audit my site", "review web quality", "run lighthouse audit", "check page quality", or "optimize my website".