Which social media platforms are supported for meta images?

It generates optimized images for Facebook, Twitter (X), WhatsApp, and LinkedIn, including the standard 1200x630 format and 16:9 Twitter large cards.

Does this skill provide the HTML code for my website?

Absolutely. It generates the specific link and meta tags required for all icons and social images and can even offer to insert them into your code automatically.

Can I generate icons without an existing logo image?

Yes, you can generate professional assets using text slogans or even emojis with the built-in suggestion engine that recommends icons based on your project description.

Can it integrate with frameworks like Next.js or Astro?

Yes, the skill includes an auto-detection feature that identifies your framework and can update files like layout.tsx or index.html with the correct tags.

Does this require any external design software?

No, the skill uses internal scripts to handle all image processing, resizing, and color overlays directly within your Claude Code environment.

Web Asset & Open Graph Generator

Name: Web Asset & Open Graph Generator
Author: BbgnsurfTech

byBbgnsurfTech

•

デザインツール

Generates a complete suite of website favicons, mobile app icons, and social media Open Graph images from logos, text, or emojis.

概要

This skill streamlines the creation of essential web branding assets by transforming source logos, slogans, or emojis into production-ready icons and social sharing images. It handles complex resizing tasks for browser favicons and PWA icons while generating platform-specific social media cards for Facebook, Twitter, and LinkedIn. Beyond image generation, it provides the necessary HTML meta tags and offers automated integration into popular web frameworks like Next.js, Astro, and SvelteKit, ensuring your site looks professional across all platforms.

主な機能

Smart emoji-to-favicon conversion with keyword-based suggestions
Multi-format favicon generation including .ico and high-resolution PNGs
Automated HTML meta tag generation and framework-aware integration
PWA-compliant app icons for iOS and Android home screens
3 GitHub stars
Automated Open Graph and Twitter Card image creation

ユースケース

Generating a complete set of favicons and touch icons for a new web project
Updating legacy websites with modern PWA icons and Open Graph metadata
Creating branded social sharing previews for landing pages from simple text slogans

概要

主な機能

Smart emoji-to-favicon conversion with keyword-based suggestions
Multi-format favicon generation including .ico and high-resolution PNGs
Automated HTML meta tag generation and framework-aware integration
PWA-compliant app icons for iOS and Android home screens
3 GitHub stars
Automated Open Graph and Twitter Card image creation

ユースケース

Generating a complete set of favicons and touch icons for a new web project
Updating legacy websites with modern PWA icons and Open Graph metadata
Creating branded social sharing previews for landing pages from simple text slogans