Diagrams that move.
A Claude skill that turns a plain-English description — or a Mermaid source — into a single self-contained HTML file where the connectors flow and requests travel through the system as moving dots. Everything below is a real, unedited output — pure SVG/CSS, no animation library, a few KB each, looping in your browser right now. This page just embeds the files.
npx skills add csthink/dashmotion -a claude-code -gprompt: Draw our Kubernetes microservices platform — NGINX ingress, services in a shop namespace, a Kafka bus to async workers, Postgres and Mongo, an observability namespace — and animate a checkout request from ingress through cart and payments to Postgres.
prompt: Visualize our CI/CD pipeline: a commit runs lint, unit and integration tests in parallel; all three merge into building a Docker image; then a security scan; then deploy to staging; then a manual approval gate — approved deploys to production and posts to Slack, rejected notifies the author.
prompt: A signup state machine: pending → verifying email → active, with resend and expiry transitions and a failed branch.