How to Generate Landing Page Assets with Claude
Generate landing page assets using Claude and ToolRouter. Complete visual packages created by AI.
ToolGenerate ImageClaude creates landing page visual assets through iterative design sessions in your terminal. Generate hero images, feature illustrations, and background elements through multi-step conversation while maintaining a cohesive visual language across the entire page. Claude can produce all visual assets for a complete landing page in one session.
Connect ToolRouter to Claude
1Go to Settings → Connectors → Add custom connector
2Enter the details below and click Add
Name
ToolRouterURL
https://api.toolrouter.com/mcp3Done — works on Claude chat, desktop, and mobile
Steps
Once connected (see setup above), use the Generate Image tool:
- Start with the hero: "Generate a hero image for a SaaS landing page about workflow automation"
- Claude creates the hero using text_to_image
- Add section visuals: "Create 3 matching illustrations for features: integrations, analytics, and collaboration"
- Upscale everything: "Upscale all images to 2x for retina displays"
- Ask Claude to generate background textures and patterns that tie the page together
Example Prompt
Try this with Claude using the Generate Image tool
Generate a complete set of landing page visuals for a SaaS product: 1) hero image showing workflow automation, 2) three feature section illustrations, 3) a subtle background texture. All in the same modern, clean style with blue and purple tones.
Tips
- Generate all page assets in one session to maintain visual consistency
- Use upscale_image for hero images that need to look sharp on 4K displays
- Ask Claude to create both light and dark mode versions of each asset