favicon

Generate favicon assets from a source image using ImageMagick.

4|Updated Jan 27, 2026
One-click install
npx skills add https://github.com/k97/dock-tile --skill favicon-k97
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: favicon
Source: https://github.com/k97/dock-tile/tree/main/website/.claude/skills/favicon
Command: npx skills add https://github.com/k97/dock-tile --skill favicon-k97

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires imagemagick.

What problem does it solve?

This Skill automates the tedious process of generating multiple favicon sizes and formats from a single source image and correctly updating your project's HTML or configuration files.

Core Features & Use Cases

  • Multi-Format Generation: Automatically creates .ico, .png, and .svg files in the required dimensions for modern browsers and mobile devices.
  • Framework Awareness: Detects your project structure (e.g., Rails, Next.js, Vite, Static HTML) to place assets in the correct directory.
  • Use Case: When launching a new web project, use this to instantly generate all necessary branding icons and manifest files from your logo, ensuring your site looks professional across all platforms.

Quick Start

Use the favicon skill to generate a complete set of icons from the source image located at assets/logo.png.

Frequently Asked Questions about favicon

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a complete favicon set from a single image?

To generate a complete favicon set from a single image, you need an image processing tool to automatically resize and convert the source file into .ico, .png, and .svg formats. This process also updates your HTML metadata or manifest files.

Do I need ImageMagick installed to automate favicon generation?

Yes, ImageMagick v7+ is required to perform the image processing and format conversion tasks. It handles resizing the source image into the various dimensions required for modern browsers and mobile devices.

Can I automatically place favicon assets in the correct directory for Next.js or Rails?

Yes, automated favicon generation can detect your project's framework structure, such as Next.js, Rails, or Vite. It then places the generated .ico and .png files directly into the correct static directory.

What is the best way to automate branding icon creation for web projects?

The best way to automate branding icon creation is using a script that detects your project structure and generates all required favicon dimensions from one logo. This ensures cross-platform consistency and automatically updates configuration files.

What formats and dimensions are needed for modern browser favicons?

Modern browser favicons require .ico, .png, and .svg files in specific dimensions. Generating a comprehensive suite of these assets from a single source image ensures your site displays correctly across all platforms and mobile devices.

Will favicon automation update my web project's manifest files?

Yes, favicon automation detects your project framework and automatically updates HTML metadata or manifest files. This ensures the generated .ico, .png, and .svg assets are correctly linked without manual coding.