Open generator
Русский

Guides

Short, practical guides about favicons: ICO, SVG, dark mode, HTML snippet, Apple/Android.

Guide cover

SVG → ICO online: create favicon.ico from vector | Favicon.kz

How to generate favicon.ico from SVG: best sizes inside ICO, transparency, common mistakes, and a fast workflow.

Updated: 2026-01-21 Open →
Guide cover

PNG → SVG favicon: how to convert without losing quality | Favicon.kz

How to convert a PNG image into an SVG for favicon use: vectorize, simplify paths, remove tiny details, then generate a full set.

Updated: 2026-01-21 Open →
Guide cover

Transparent favicon (no background): when it works and when to add a background | Favicon.kz

Transparent favicons in SVG/PNG/ICO: browser nuances, readability on light/dark tabs, and practical tips.

Updated: 2026-01-21 Open →
Guide cover

Online favicon editor: quick tweaks without Figma | Favicon.kz

Quickly adjust favicon scale, corner radius, background and colors, plus preview in light/dark tabs and search snippets.

Updated: 2026-01-21 Open →
Guide cover

Favicon from text (initials/letter) in SVG — how to make it | Favicon.kz

Make a favicon from a single letter or initials: prepare SVG in Figma/Illustrator, convert text to outlines, generate SVG/PNG/ICO.

Updated: 2026-01-21 Open →
Guide cover

Instagram favicon: how to download the icon and make a shortcut | Favicon.kz

How to get Instagram’s favicon for personal shortcuts or as a reference, and how to design a clean social icon for your site.

Updated: 2026-01-21 Open →
Guide cover

Download a favicon from any website (ICO/SVG/PNG) — 5 quick ways | Favicon.kz

How to download a website favicon fast: direct URLs, page source, DevTools Network tab, Google cache, and manifest.

Updated: 2026-01-21 Open →
Guide cover

Favicon 120×120 (SVG/PNG): when you need it and how to generate it | Favicon.kz

Is 120×120 a real favicon standard? Key sizes for 2026 and the easiest way to get a clean 120×120 from SVG.

Updated: 2026-01-21 Open →
How to refresh a favicon: browser cache and search engine cache | Favicon.kz

How to refresh a favicon: browser cache and search engine cache | Favicon.kz

Updated your favicon but still see the old one? Fix caching, verify URLs, avoid 404s, and keep stable paths.

Updated: 2026-01-18 Open →
Favicon for WordPress: 3 reliable ways to add it | Favicon.kz

Favicon for WordPress: 3 reliable ways to add it | Favicon.kz

How to set a favicon in WordPress: Site Icon, theme/head injection, and full SVG+ICO+PNG set for best coverage.

Updated: 2026-01-18 Open →
Safari pinned tab icon: how to add mask-icon and color | Favicon.kz

Safari pinned tab icon: how to add mask-icon and color | Favicon.kz

How to add a Safari pinned tab icon using <link rel="mask-icon"> with an SVG and color.

Updated: 2026-01-18 Open →
Exporting SVG from Illustrator for favicons: avoid empty files | Favicon.kz

Exporting SVG from Illustrator for favicons: avoid empty files | Favicon.kz

How to export an SVG from Adobe Illustrator for reliable favicon generation: viewBox, bounds, and no external resources.

Updated: 2026-01-18 Open →
SVG with external fonts/images: why it breaks and how to fix it | Favicon.kz

SVG with external fonts/images: why it breaks and how to fix it | Favicon.kz

Some SVGs reference external fonts or images. That can break conversion and rendering. Here’s how to embed resources or switch to PNG.

Updated: 2026-01-18 Open →
Maskable icons (PWA/Android): what they are and how to create them | Favicon.kz

Maskable icons (PWA/Android): what they are and how to create them | Favicon.kz

Maskable icons for Android/PWA: why you need them, safe zone tips, and how to set purpose in manifest.json.

Updated: 2026-01-18 Open →
Minimal favicon set: how many files you need in 2026 | Favicon.kz

Minimal favicon set: how many files you need in 2026 | Favicon.kz

A practical minimal favicon set: SVG, ICO, 192/512, apple-touch-icon, and manifest.json. Simple checklist for modern sites.

Updated: 2026-01-18 Open →
Favicon in Next.js/React: App Router and Pages Router | Favicon.kz

Favicon in Next.js/React: App Router and Pages Router | Favicon.kz

How to add favicons in Next.js: keep files in /public, link them via metadata (App Router) or <Head> (Pages).

Updated: 2026-01-18 Open →
PWA icons and splash screens: 192 and 512 sizes explained | Favicon.kz

PWA icons and splash screens: 192 and 512 sizes explained | Favicon.kz

Minimal PWA icon requirements: 192×192 and 512×512, how they relate to splash screens, and why manifest.json matters.

Updated: 2026-01-18 Open →
Favicon MIME types: SVG, ICO, PNG — correct server setup | Favicon.kz

Favicon MIME types: SVG, ICO, PNG — correct server setup | Favicon.kz

Correct Content-Type headers for favicon files: image/svg+xml, image/x-icon, image/png. Why wrong MIME can break favicons.

Updated: 2026-01-18 Open →
Favicon not showing in Google: causes and fixes | Favicon.kz

Favicon not showing in Google: causes and fixes | Favicon.kz

Why Google may not show your favicon in search results and how to fix it: file paths, sizes, cache, 404s, and headers.

Updated: 2026-01-18 Open →
Favicon not showing in Yandex: what to check | Favicon.kz

Favicon not showing in Yandex: what to check | Favicon.kz

Why Yandex may not display your favicon: cache, 404s, wrong sizes, blocked files, and update delays.

Updated: 2026-01-18 Open →
AP

Apple Touch Icon: sizes, files, and best practices | Favicon.kz

A short guide to Apple Touch icons: what they are, what sizes you need, and how to connect them correctly.

Updated: 2026-01-18 Open →
HT

Favicon HTML snippet for <head> (SVG, ICO, PNG, manifest) | Favicon.kz

Copy-paste favicon tags: SVG, ICO fallback, Apple Touch icons, Android icons, and manifest.json — with a clean structure for 2026.

Updated: 2026-01-18 Open →
MA

manifest.json / webmanifest: what it is and why it matters | Favicon.kz

Learn what a web app manifest does, what fields matter, and how it relates to Android icons and splash screens.

Updated: 2026-01-18 Open →
SV

Export a clean SVG from Figma for favicons | Favicon.kz

How to export an SVG from Figma (or similar tools) so it renders correctly everywhere and doesn’t become “empty”.

Updated: 2026-01-18 Open →
TR

SVG uploads as “empty”: causes & fixes | Favicon.kz

If an SVG looks empty after upload, it’s usually viewBox/bounds or transforms. Here are quick fixes and export tips.

Updated: 2026-01-18 Open →
YA

Favicon in Google & Yandex search results: tips | Favicon.kz

What affects favicon appearance in Google and Yandex SERPs and how to increase the chance it looks crisp and recognizable.

Updated: 2026-01-18 Open →
FA

SVG favicon: pros, cons, and how to use it | Favicon.kz

SVG favicons scale perfectly and look sharp. Here’s how to use SVG safely with fallbacks for best compatibility.

Updated: 2026-01-18 Open →
DA

Dark mode favicons: how to set up (prefers-color-scheme) | Favicon.kz

Make your favicon look great in both light and dark browser themes using prefers-color-scheme and two SVG icons.

Updated: 2026-01-18 Open →
FA

How to create favicon.ico from SVG (fast & correct) | Favicon.kz

A practical guide to favicon.ico: what it is, when you still need it in 2026, and how to generate it from a single SVG with the right sizes.

Updated: 2026-01-18 Open →
FA

Favicon sizes checklist (browser, iOS, Android) | Favicon.kz

A practical list of favicon sizes and files you typically need today: browser tabs, bookmarks, Apple Touch, Android, and PWA.

Updated: 2026-01-18 Open →
Tip: add new pages by creating JSON files in /content/guides/en/