If you are a web developer you know what a favicon is. It’s the small image you can see in the browser title bar right next to the web page title. This is mainly used for branding purposes. Of course it’s giving good impression about the website to the users. Since most of the modern browsers are using tabs this favicon will be displayed in the tab.
If you want to add a favicon for your website, as the first step you have to create an image file following below specification.
- File Format: ICO
- Dimensions: 16 x 16px
No problem you can create a image file with given dimension, but you will find out that most of the common image editors doesn’t support this file format.
Then you might try to download ICO file from some website, but in that there won’t be the element of originality.
Here is a good solution for you to create your own original favicon using online tool comes totally free. This will give you array of options to customize your favicon exactly the same way you need it.
How to Use Favicon.cc
- Visit Favicon.cchome page
- There you have an image editor in the middle and color picker in right panel.
- If you take a closer look in to color picker you will be able to see transparency adjustment, Last used colors, eraser, automatic color picker and move tool.
- If you need animated favicon, you can expand the use animation section under the image editor.
- All you have to do is draw whatever you need in the image canvas using mouse.
- If you feel like drawing using mouse is not a good plan, you can import a image from your local computer.
- Then it will be automatically converted to the favicon format.
- Below the image canvas you will be able to see a preview of favicon as it will be seen on the browser.
- There you have the download link download the file to your computer.
This is a very simple and easy tool for you to create your own original favicon for your website. Operations are flexible and letting you to draw one from the scratch and convert existing image to a favicon as well.
How to Add Favicon to Your Web Page?
In HTML files things goes between tag will be displayed in the browser page and meta data goes in between tag. Since favicon won’t be displayed one the page but on the browser title bar it will go in between tag.
As the first step upload the created favicon file to a known location on your web server. Then insert the below code to the page where you need to add the favicon.
Now you will be able to see your own favicon once you load the web page in browser tab.
Tags: #Design #Web