Favicon for Chrome New Tab: Stop Serving Blurry Shortcuts

Open a new tab in Chrome right now. Look at the grid of your most visited sites. You'll probably see GitHub's crisp silhouette or Stripe's vibrant logo. Now look closer—is there a site showing a blurry, pixelated mess, or just a generic gray circle with a letter? That happens when your favicon for Chrome new tab shortcuts isn't configured correctly.

The Chrome New Tab Page (NTP) is prime real estate. When users frequent your web app, Chrome automatically adds it to this grid. But Chrome's shortcut grid requires larger, higher-quality icons than the tiny 16x16 pixels used in the standard browser tab.

How Chrome's New Tab Page Sources Icons

Chrome doesn't fetch a fresh icon every time a user opens a new tab. Instead, it reads from a hidden local SQLite database on the user's machine.

During a visit, Chrome scans your HTML and caches the best available icon. If you only provide a legacy low-resolution file, Chrome is forced to stretch it for the NTP shortcut grid. The result is a fuzzy, unprofessional look that hurts brand trust. (If you are debugging this, you might want to read our guide on troubleshooting Chrome cache issues).

The Ideal Setup for 2026

To ensure your site looks sharp on the Chrome NTP, you need to stop relying on a single legacy file. We recommend a dual-format approach using SVG with a high-resolution PNG fallback.

Here is the exact code you should drop into your document head:

<link rel='icon' type='image/svg+xml' href='/icon.svg'>
<link rel='icon' type='image/png' sizes='32x32' href='/icon-32x32.png'>
<link rel='apple-touch-icon' href='/apple-touch-icon.png'>

Best Practices for NTP Shortcuts

Getting the code right is only half the battle. Your design needs to survive Chrome's UI quirks.

• Keep it simple: The NTP grid icons are small. Drop the text and use your brand's core symbol.
• Plan for dark mode: Chrome's NTP changes background colors based on the user's OS theme. A black logo with no background will completely disappear in dark mode.
• Provide a 32x32 minimum: While 16x16 works for the top tab bar, the NTP needs more pixels. Check our 2026 size guide for the exact dimensions.

If you are still manually resizing images in Photoshop to fix your Chrome shortcuts, you are wasting time. Use Mzu favicondl to generate the exact SVG and PNG files Chrome demands, complete with the correct HTML tags.