Canvas Design
If you need Claude to generate actual image files with compositions that follow basic design rules, this handles it through HTML Canvas or Python imaging libraries. It's not about UI components or web layouts. It's about creating static visual outputs like charts, diagrams, or graphics with attention to things like the rule of thirds, color harmony, and visual hierarchy. The skill documentation covers composition fundamentals and color theory with specific palettes (complementary, analogous, triadic). Useful when you want programmatic image generation that looks intentional rather than just functional. It has passed security audits from Gen Agent Trust Hub, Socket, and Snyk, with 223 installs and 1.1K stars on the parent repo.
- skills.sh installs
- 223
- GitHub stars
- 1.1K
- last updated
- Jun 3, 2026
Install
$ npx -y skills add skillcreatorai/ai-agent-skills --skill canvas-design --agent claude-codeInstalls into .claude/skills of the current project.
Files
If you need Claude to generate actual image files with compositions that follow basic design rules, this handles it through HTML Canvas or Python imaging libraries. It's not about UI components or web layouts. It's about creating static visual outputs like charts, diagrams, or graphics with attention to things like the rule of thirds, color harmony, and visual hierarchy. The skill documentation covers composition fundamentals and color theory with specific palettes (complementary, analogous, triadic). Useful when you want programmatic image generation that looks intentional rather than just functional. It has passed security audits from Gen Agent Trust Hub, Socket, and Snyk, with 223 installs and 1.1K stars on the parent repo.
Browse the repository on GitHubSponsors
Agent CaffeineSponsoredClose your lid, come back to finished work
SnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthly
WaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthly
knobsSponsoredSee your site on any phone, any day, in any languageDetails
- Repository
- github.com/skillcreatorai/ai-agent-skills
- Categories
- AI & Agent Building, Design & UI/UX
- First seen
- Jun 3, 2026
More from skillcreatorai/ai-agent-skills
All 30- Job Application214
- Javascript Typescript211
- Xlsx172
- Web Design Guidelines164
- Docx157
- Webapp Testing155
- Pptx149
- Frontend Design143
- Jira Issues141
- Skill Creator131
- Lead Research Assistant128
- Pdf124
- Video Downloader121
- Vercel Deploy120
- Qa Regression118
- File Organizer116
- Brand Guidelines115
- Code Review970
- Backend Development749
- Code Refactoring596
- Code Documentation406
- Best Practices397
- Database Design394
- Expo App Design363
Recommended
More AI & Agent Building
llm-optimized-contentguia-matthieu/clawfu-skillsUse when creating content that must be discoverable by AI search engines (ChatGPT, Perplexity, Gemini). Use when SEO alone isn't enough, when you need AI citati222skills.sh installs
create-agent-skillseveryinc/compound-engineering-pluginExpert guidance for creating Claude Code skills and slash commands. Use when working with SKILL.md files, authoring new skills, improving existing skills, creat218skills.sh installs
system-designqodex-ai/ai-agent-skillsDesign and architect software systems. Plans system components, interactions, and deployment patterns for scalability and maintainability.217skills.sh installs
llm-integrationyonatangross/orchestkitLLM integration patterns for function calling, streaming responses, local inference with Ollama, and fine-tuning customization. Use when implementing tool use, 216skills.sh installs
self-improving-agentkimasplund/clawdbot-skills-packEnables continuous self-improvement through learning from failures, user corrections, and capability gaps. Integrates with QAVR for learned memory ranking.212skills.sh installs