web-asset-generator  by alonw0

Claude skill for automated web asset generation

Created 5 months ago
302 stars

Top 88.3% on SourcePulse

GitHubView on GitHub
Project Summary

A Claude Code Skill designed to automate the generation of production-ready web assets like favicons, app icons, and social media images. It targets developers and designers seeking a streamlined workflow, enabling them to create these assets through natural language conversations with Claude, benefiting from integrated validation and framework auto-detection.

How It Works

This project leverages the Claude Code Skill framework, allowing users to interact with Claude naturally to generate various web assets. The skill processes requests, suggests relevant emojis, generates icons in multiple sizes, validates files for accessibility and format, detects project frameworks (e.g., Next.js, Astro), and can automatically integrate generated assets by adding necessary HTML tags.

Quick Start & Requirements

  • Prerequisites: Claude Code 2.0.13 or later, Python 3.6+ with pip.
  • Installation:
    • Recommended: Via Claude Plugin Marketplace: /plugins marketplace add alonw0/web-asset-generator followed by /plugin install web-asset-generator@web-asset-generator-marketplace.
    • Manual: Clone the repository, copy the skills/web-asset-generator/ directory to ~/.claude/skills/, and install dependencies.
  • Dependencies: pip install Pillow. Optional for emoji support: pip install pilmoji 'emoji<2.0.0'.
  • Restart: Claude Code must be restarted after installation.
  • Demo: A video demonstration is available via a GitHub link.

Highlighted Details

  • Generates browser favicons (16x16 to 512x512, .ico) and PWA/mobile app icons (180x180, 192x192, 512x512).
  • Creates social media images (Open Graph for Facebook, Twitter, LinkedIn) with customizable text and dynamic font sizing.
  • Features 60+ curated emojis with smart suggestions for asset generation.
  • Includes validation for file dimensions, sizes, formats, and WCAG contrast compliance.
  • Supports automatic PWA manifest.json generation and framework detection for code insertion.

Maintenance & Community

This project is community-driven, with contributions welcomed via its GitHub repository. A CHANGELOG.md tracks version history, and CONTRIBUTING.md outlines contribution guidelines. The roadmap indicates planned features like WebP/AVIF support and expanded platform support.

Licensing & Compatibility

The project is released under the MIT License, generally permitting commercial use and integration into closed-source projects without significant restrictions.

Limitations & Caveats

Current roadmap items such as WebP/AVIF support, Pinterest/Instagram integration, dark mode variants, batch processing, and a web preview interface are not yet implemented. Emoji support requires a specific version constraint (emoji<2.0.0). The primary interaction model is through Claude Code, which may not suit all workflows.

Health Check
Last Commit

2 months ago

Responsiveness

Inactive

Pull Requests (30d)
0
Issues (30d)
0
Star History
95 stars in the last 30 days

Explore Similar Projects

Feedback? Help us improve.