F
Favicon Generator

Favicon generator for WordPress

Upload favicon files to your theme or use the Site Icon feature with custom assets.

WordPress

Generate your favicon package first, then follow the steps below to integrate with WordPress.

Generate favicons

Installation steps

  1. 1

    Generate your favicon package and upload files via FTP/SFTP to your theme or site root.

  2. 2

    Option A: Upload favicon.ico to the WordPress root (same level as wp-config.php).

  3. 3

    Option B: Use Appearance → Customize → Site Identity → Site Icon (512×512 source).

  4. 4

    For full control, add link tags to header.php or a child theme functions.php hook.

  5. 5

    Clear WordPress cache plugins and browser cache after updating icons.

Code & configuration

Copy and adapt for your WordPress project

<?php
// child theme functions.php
add_action('wp_head', function () {
  ?>
  <link rel="icon" type="image/png" href="<?php echo get_site_url(); ?>/favicon-96x96.png" sizes="96x96" />
  <link rel="icon" type="image/svg+xml" href="<?php echo get_site_url(); ?>/favicon.svg" />
  <link rel="shortcut icon" href="<?php echo get_site_url(); ?>/favicon.ico" />
  <link rel="apple-touch-icon" sizes="180x180" href="<?php echo get_site_url(); ?>/apple-touch-icon.png" />
  <link rel="manifest" href="<?php echo get_site_url(); ?>/site.webmanifest" />
  <?php
}, 1);

Pro tips

  • Site Icon in Customizer auto-generates sizes — our package gives you finer control.
  • Use wp_enqueue style hooks only for CSS; favicons belong as <link> tags in head.

Files to deploy

favicon.ico
favicon.svg
favicon-96x96.png
apple-touch-icon.png
android-chrome-192x192.png
android-chrome-512x512.png
site.webmanifest