---
title: "flow-diagram skill example: diagram · skilld"
description: "Claude Code made this diagram with the /flow-diagram skill from one prompt: “Write it in English, and don't stop to ask me questions. Draw an interactive flow…"
canonical_url: "https://skilld.dev/skills/demos/unclecatvn/agent-skills/flow-diagram"
meta:
  "og:description": "Claude Code made this diagram with the /flow-diagram skill from one prompt: “Write it in English, and don't stop to ask me questions. Draw an interactive flow…"
  "og:title": "flow-diagram skill example: diagram"
---

# **What /flow-diagram made**

One recorded run: the prompt, and what the Agent built with the Skill.

Teach your agent skilld

`npx skilld install skilld --global`

Adds the skilld Skill to your agent for every project.

Opus 5.5Recorded with Claude Code, Opus 5.5 [ Open the demo of /flow-diagram](https://skilld.dev/gh/unclecatvn/agent-skills/flow-diagram#demo)

PromptWrite it in English, and don't stop to ask me questions. Draw an interactive flow diagram for Sleetgarden, a fictional photo-sharing app: how one uploaded photo becomes three thumbnails, through the upload API, virus scan, resize queue, image workers, object storage, and CDN, including what happens when a resize fails. Save it as one self-contained flow.html with all CSS and JavaScript inline.

[/flow-diagram](https://skilld.dev/gh/unclecatvn/agent-skills/flow-diagram)

Hoai Nam·agent-skills