Web Asset Generator

A comprehensive tool for generating professional web assets from a single source - whether a logo image, text slogan, or emoji. Creates complete favicon sets, PWA app icons, and social media Open Graph images for all major platforms (Facebook, Twitter, LinkedIn). Transforms a single input into all the icons and images your website needs, with built-in validation, accessibility checking, and framework-specific integration code.

The skill uses Claude's interactive visual UI for a streamlined workflow:

1. Select Asset Types - Visual selector for what you need: favicons only, app icons only, social images only, or everything

2. Provide Source - Choose your input method:

   • Upload an existing logo/image
   • Generate from text/slogan with custom colors
   • Use curated emoji suggestions (60+ organized by industry)

3. Generate & Validate - Skill automatically:

   • Generates all required sizes (16×16 through 512×512)
   • Validates file sizes and dimensions
   • Checks WCAG contrast compliance for accessibility
   • Creates PWA manifest.json with proper configuration

4. Framework Integration - Automatically detects your framework (Next.js, Astro, etc.) and offers to add HTML tags to your code

5. Test - Provides validator links (realfavicongenerator.net, etc.) for final verification

No manual image editing required - from single input to complete asset set with validation and integration code.