Time SVG Creator
A trivial but real rendering demo from the agent-teams variant: it takes Dubai time fields given by the calling context (typically from time-fetcher), fills its SVG template
- What
- A trivial but real rendering demo from the agent-teams variant: it takes Dubai time fields given by the calling context (typically from time-fetcher), fills its SVG template
- Cost
- Free
- Needs
- Before you start: read this whole install prompt, tell me in a few lines what this skill does and what installing it involves, and wait for my go-ahead before you do anything else.
- Install
- Copy the installer prompt below into your Muse — your agent does the rest.
Curated by Skill Harbor — A trivial but real rendering demo from the agent-teams variant: it takes Dubai time fields given by the calling context (typically from time-fetcher), fills its SVG template, and writes a 400x250 time card to agent-teams/output/dubai-time.svg plus a markdown summary to agent-teams/output/output.md. It never fetches the time itself. Output paths are hardcoded from the source demo layout. By @shanraisshan, listed here with credit to its creator. MIT licensed. Skill Harbor never reviews the code, review it yourself before use.
Version:
Install
Copy the install package below, then paste it into Muse📌 Pinned version: commit cd8e296Before you start: read this whole install prompt, tell me in a few lines what this skill does and what installing it involves, and wait for my go-ahead before you do anything else. Prerequisites — None to install this skill — no account, no key, no payment, no network. Honest scope: it does NOT fetch the time itself and its own rules forbid re-fetching or recalculating it; it only renders the values it is given, and it writes its two output files to hardcoded paths from the source repository's agent-teams layout (agent-teams/output/dubai-time.svg and agent-teams/output/output.md, relative to the current project). Install "Time SVG Creator" for me. It creates a visual SVG time card for Dubai (400x250, gradient navy card) from three fields supplied by the calling context — time, timezone and formatted, typically produced by the sibling time-fetcher skill — using the exact template in its reference.md, and writes the card to agent-teams/output/dubai-time.svg plus a markdown summary to agent-teams/output/output.md. It uses the given values exactly and never re-fetches. The time counterpart of the weather-svg-creator demo pattern. Its folder holds SKILL.md plus reference.md (the templates and design specs) and examples.md (worked examples). Repository: https://github.com/shanraisshan/claude-code-best-practice (the skill is the whole agent-teams/.claude/skills/time-svg-creator/ folder at the pinned commit: SKILL.md, examples.md, reference.md, 3 files in total) Pinned version: install the code at commit cd8e296b06dd1dea732ec15e39645b4edba09bcf exactly. Do not substitute a newer version. If this commit is unreachable, stop and tell me. 1. Clone https://github.com/shanraisshan/claude-code-best-practice into a temporary folder, check out commit cd8e296b06dd1dea732ec15e39645b4edba09bcf, and copy the agent-teams/.claude/skills/time-svg-creator/ folder from that checkout. Then compare every file in the folder with the fingerprints recorded for this listing on 2026-10-22: [FINGERPRINTS] - SKILL.md: SHA-256 c5464a3aeb2b7a2cef37c05329c9db88fa14495cd5c13303aecf41ac9e1a42fb - examples.md: SHA-256 8c8e81454f6b08f37b419515461f56dbbdc86e6150d4409a71985b89fe1417b5 - reference.md: SHA-256 dd5a1a3b7efe524f3349c735ed0be5685485ccdd0e31c888ea81296e2d629a2f If a file does not match, it changed since the listing was prepared: do not install it yet, tell me what you found and let me decide. 2. Read SKILL.md in full, and tell me in plain words: what the skill does when used, what it connects to, whether it reads or sends any personal information or credentials, and anything that seems unusual. Stop on any red flag and tell me before going further. Confirm these points from the files: - The folder holds 3 files only: SKILL.md (1,204 bytes, frontmatter name time-svg-creator, allowed-tools Write and Read only), reference.md (the SVG and markdown templates with design specs) and examples.md (worked examples). There is no script and no other code in it. - Nothing is sent anywhere during installation itself; the only download at install time is the skill folder from GitHub at the pinned commit. - At use time it only writes two local files, to the hardcoded relative paths agent-teams/output/dubai-time.svg and agent-teams/output/output.md in the current project, using exactly the time values it is given (its rules forbid re-fetching). It reads no personal information or credentials and sends nothing anywhere. - Do not create any SVG card, do not write any output file, and do not use the skill in any way during this install: using it is a separate step that only starts when I ask for it later. 3. When I say "yes, install", install it as a skill: copy the whole time-svg-creator folder into the agent's skills directory, in a folder named exactly "time-svg-creator", keeping its 3 files in their original relative layout (SKILL.md at its root). 4. Verify with no network calls: frontmatter valid (name: time-svg-creator), the 3 files in place with matching fingerprints. Do not run anything from the folder and do not use the skill to verify. 5. Report what was installed, where, and what I still need to do myself (for example: that this skill only renders time values it is given (it never fetches the time itself) and writes to the hardcoded agent-teams/output/ paths, and that using it is a separate step that only starts when I ask for it later). GitHub is optional: if I have a GitHub account or the gh CLI, you may use it; otherwise public access is fine. Never require it unless it's in the prerequisites above. Rules: don't touch anything outside the temp folder and the install target. If anything looks off, stop and ask me.
Saved to your recent installs. Find it anytime on /connect.
🔒 Security, provenance and what this touches
- It can create or modify files.
What the scan found — excerpts from the install prompt
- writes files — - Do not create any SVG card, do not write any output file, and do not use the skill in any way during this in · - Ne crée aucune carte SVG, n'écris aucun fichier de sortie, et n'utilise le skill d'aucune façon pendant cett
The install prompt below already includes the vetting steps: your agent follows the community checklist before installing anything with executable code. Want more?
Questions
How do I install a build?
Every product page includes a copy-paste install prompt. Paste it into your Muse and it sets the build up for you — no manual configuration.
Where does my money go?
Straight to the seller. Skill Harbor never processes payments: checkout happens on the seller’s own page, usually Stripe.
What does the ✓ next to a creator’s name mean?
It means we confirmed the identity of the person behind the listing. It says nothing about the code itself — always check a build before installing it.