Made By Nathan
  • Blog
  • 3D Printing
  • DocSpring
  • Homepage
web-design

Creating a new favicon with text-to-image AI

Nathan Broadbent

Nathan Broadbent

02 Oct 2022 — 3 min read

It's been a while since I wrote a blog post about creating a favicon.ico file for your website or blog. Things have changed a bit since I wrote that blog post in May 2010.

I've been updating the CSS for my blog recently, and I wanted to update the favicon. Here's the old green square icon that I was using before:

My old green square favicon

I wanted something a bit more interesting, so I tried using some of the new text-to-image AI tools that have been getting a lot of attention lately. I used Midjourney and DALL·E 2. (Midjourney uses Stable Diffusion.)


I played around with some different prompts in Midjourney and DALL·E 2, and I iterated on a few different ideas. I enjoy spending time in Midjourney's shared Discord channels (e.g. #general-*), where you can see what other people are doing and get some inspiration for prompts.

Midjourney shared chat channel general-4

Here's a few examples of the prompts that I was trying:


website favicon logo, circuit board PCB design, vector, SVG, blue purple gradient, hexagon, bolt and tools icon


small favicon logo for a blog website, circuit board pattern, electronics, vector, epic ultra wide aerial shot from atmosphere, cool gradients, ultra high contrast, blue background, psychedelic color, vortex, hyperrealism, intricate details, cinematic lighting

Here's some of the images that I generated using DALL·E 2:

Collection of images from Dalle 2

And here's some from Midjourney:

Collection of images from Midjourney

I eventually found some shapes and colors that looked pretty cool, so I generated some variations using the Midjourney Discord Bot.

Variations on a shape

Eventually I settled on this one. It kind of looks like an abstract "N". I tweaked the colors and contrast a little bit in GIMP.

I settled on this gradient and shape

I used realfavicongenerator.net to generate a favicon package with lots of different sizes and (mostly unnecessary) features.

realfavicongenerator.net is awesome. I use them for all my websites.

They provide this HTML to include in my <head> tag:

<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="manifest" href="/site.webmanifest" />
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
<meta name="msapplication-TileColor" content="#603cba" />
<meta name="theme-color" content="#ffffff" />

So here's the new favicon:

My new favicon

P.S. Here's one I didn't end up using, in case you want it:

WET BECTOLON

Wet Bectolon. Crdoruf Ptaogoatuy

(wetbectolon.com is available!)

Read more

How I Turned Our Rented House into a Smart Home

How I Turned Our Rented House into a Smart Home

We've been renting a house in Auckland, New Zealand. This house needs a lot of maintenance and renovation, but the landlords let us have two cats and a dog so we can't complain! They also let us do whatever we want to the house (within reason)

By Nathan Broadbent 22 Mar 2025
Background Extra Work

Background Extra Work

I signed up with an agency (BGT) and started doing some extra work in 2024. It's a lot of fun to be on movie and TV sets. (It can also pay quite well if you book a commercial!) Spartacus: House of Ashur I'm a "Roman

By Nathan Broadbent 19 Jul 2024
Desk Lighting For Each Day Of The Week

Desk Lighting For Each Day Of The Week

I have an LED strip behind my desk in my office. It's controlled by an ESP32 running the WLED firmware. I've had it stuck on a fixed color preset for around a year. (See above.) I still like these colors, but I thought it would be

By Nathan Broadbent 06 May 2024
3D Printed Pegboard Mounts for Stanley Fatmax V20 Power Tools

3D Printed Pegboard Mounts for Stanley Fatmax V20 Power Tools

I have some Stanley Fatmax power tools: * Impact Driver * Drill * Jigsaw * Sander * Circular Saw I also have their lawnmower, leaf blower, and pressure washer. It's great that we can use the same batteries for everything. I decided to mount the hand-held power tools on a pegboard in my

By Nathan Broadbent 05 May 2024
Made By Nathan
Powered by Ghost