Found a bug?

Favicon Generator

A full set of site icons from an image, letter or emoji, ico, png, the iPhone icon, a manifest and embed code, everything running right in your browser.

A 16-pixel icon fits one letter, rarely two. Three already blur together.

Styling

Mark color

How will see this?

Browser tab, the same one in both themes
Your site light
Your site dark
16 32 iPhone
16×16 with no smoothing

Conclusions

    The rest is up to your eye. Look at the full-size preview: the icon in the tab is exactly that size, 16 pixels, smaller than a letter in this line. If no shape reads in it, no settings will help — you need a simpler drawing.

    Download

    The archive contains favicon.ico (with 16, 32 and 48 inside), favicon-16x16.png, favicon-32x32.png, favicon-96x96.png, apple-touch-icon.png, two icons for Android, site.webmanifest and code-for-head.txt. Unpack everything into the site root.

    Code for 

    
  

  

  

  
    
  

  
  
  
  
    
    
    A favicon can be made in three ways: from your own image, from one to three letters, or from an emoji, with forty emojis available in the set. For letters you pick a font and a weight, and for any variant you can adjust the background, the padding from the edge, and the corner rounding.
    
    

    The size that matters most here is 16 pixels: this is the square where the icon sits in the browser tab. A logo that looks good large often turns into a blob at this size, and three letters merge into one. That is why the preview shows the small sizes right away, before you download anything.
    

    You can take the result in three ways: the whole set as an archive, favicon.ico only, or just the large 512×512 PNG. The archive is handy when you are building a site from scratch, while individual files work when you need to replace the icon on a finished site.
    
  
    
  

   
    Rate this tool
    Help us get better
              
    


  
  
    
    
    Other tools
    
    
    
      
      
        
    CSS Sprite Generator
    
        
    Glues icons into one file with ready-made CSS.
    
          
      
      
        
    Add Text to Image
    
        
    A caption or watermark on photos, with batch processing.
    
          
      
      
        
    Photo Watermark
    
        
    A semi-transparent caption or tile across the whole image.
    
          
      
      
        
    Photo Editor
    
        
    An image editor in the browser, nothing to install
    
          
      
      
        
    Image Color Palette
    
        
    A palette from a picture, with color shares and a contrast check
    
          
      
      
        
    Resize Image
    
        
    Image size by width, height or percent, saved as JPEG, PNG or WebP
    
          
      
      
        
    Crop Image
    
        
    Frame by mouse or exact pixels, everything happens locally
    
          
      
      
        
    QR Code Scanner
    
        
    QR reading from an image or camera, contents split into fields