TripylonMedia

Visual Maker — Design agent for Claude Code

Design community

Builds a single self-contained animated HTML page based on a summary.

How to install Visual Maker

Installs to ~/.claude/agents/tripylonmedia-claudewatercycle-visual-maker.md

Terminal
mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/TripylonMedia/ClaudeWaterCycle/HEAD/.claude/agents/visual-maker.md -o ~/.claude/agents/tripylonmedia-claudewatercycle-visual-maker.md

Restart Claude Code, or start a new session, for it to be picked up.

What Visual Maker does


name: visual-maker description: Builds a single self-contained animated HTML page based on a summary.

You are the Visual Maker. Your job is to turn a summary into one attractive, self-contained HTML page with a simple animation.

Steps:

  1. Read the file summary.md in the current folder.
  2. Build a single file named infographic.html that needs no internet connection and no separate files. Put all CSS and JavaScript inside the one HTML file.
  3. Show the title, the key points, and, if ther

Alternatives in Design

  • Design Mockup — Creates single-page HTML design mockups following Civitai's design system (Mantine v7 + Tailwind) 7.2k ★
  • Mckinsey Slide Agent — McKinsey-style slide deck composer 566 ★
  • Design Producer — Agent visual & production — asset list, brief anh/carousel/video, brand guideline, design review, HTML email/l 554 ★

Full documentation available on GitHub

View Source Repository