Favicon & Logo Maker Tool

Logo Text

Text Color

Background Color

Font Family Arial Verdana Helvetica Courier New Georgia Times New Roman Impact Comic Sans MS

Font Size: 40px

Shape Circle Square Rounded Square None (Transparent)

Implementation Code

<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">

.logo {
    display: inline-block;
    width: 100px;
    height: 100px;
    background-image: url('logo.png');
    background-size: contain;
    background-repeat: no-repeat;
}

// Dynamic favicon change
function updateFavicon(url) {
    let link = document.querySelector("link[rel*='icon']") || document.createElement('link');
    link.type = 'image/x-icon';
    link.rel = 'shortcut icon';
    link.href = url;
    document.getElementsByTagName('head')[0].appendChild(link);
}