29 lines
1.1 KiB
Markdown
29 lines
1.1 KiB
Markdown
|
---
|
||
|
title: "Customize the Favicon"
|
||
|
date: 2019-08-11 00:34:00 +0800
|
||
|
categories: [Blogging, Tutorial]
|
||
|
tags: [favicon]
|
||
|
toc: false
|
||
|
---
|
||
|
|
||
|
The image files of [Favicons](https://www.favicon-generator.org/about/) are placed in `assets/img/favicons`. You may need to replace them with your own. So let's see how to customize these Favicons.
|
||
|
|
||
|
Whit a square image (PNG, JPG or GIF) in hand, open the site [*Favicon & App Icon Generator*](https://www.favicon-generator.org/) and upload your original image.
|
||
|
|
||
|
![upload-image]({{ site.baseurl }}/assets/img/sample/upload-image.png)
|
||
|
|
||
|
Wait a moment for the website to generate icons of various sizes automatically.
|
||
|
|
||
|
![download-icons]({{ site.baseurl }}/assets/img/sample/download-icons.png)
|
||
|
|
||
|
Download the generated package and extract to override the files in directory `assets/img/favicons`.
|
||
|
|
||
|
At last, rebuild the site so that the icon becomes your custom edition.
|
||
|
|
||
|
## See Also
|
||
|
|
||
|
* [Getting Started]({{ site.baseurl }}/posts/getting-started/)
|
||
|
* [Write a new post]({{ site.baseurl }}/posts/write-a-new-post/)
|
||
|
* [Text and Typography]({{ site.baseurl }}/posts/text-and-typography/)
|
||
|
|