Using the Icon Wizard | Doing More with Font Awesome [Part 8]

Watch Using the Icon Wizard | Doing More with Font Awesome [Part 8] on YouTube

Ready to make your own icons? In this screencast, we’ll show you how to use the Icon Wizard to stack, blend, and combine Font Awesome icons into custom creations.

From adding icons and modifiers to fine-tuning layers and saving your finished creation to a Kit, we’ll walk through everything you need to start conjuring up some custom icon magic.

🧠 What You’ll Learn in This Screencast
🧩 Add icons, modifiers, elements, and User Blender pieces as layers
🎨 Position, scale, rotate, and blend layers to build your icon
✨ Combine layers with Add, Subtract, and Stroke blend methods
πŸ”€ Reorder, duplicate, and remove layers as you build
πŸ’Ύ Save your custom icon directly to a Font Awesome Kit
πŸš€ Use your saved icon in your projects just like any other Font Awesome icon
πŸ“₯ Download your creation as an SVG or PNG
πŸ”— Share your custom icon with a public landing page
⌨️ Use keyboard shortcuts to nudge, resize, flip, center, and manage your layers

⏱ Timestamps
00:00 – What is the Icon Wizard?
00:15 – Get started
00:30 – Building an icon
01:43 – Saving & sharing your icon
02:27 – Outro

The Icon Wizard is currently a beta feature, so come play around, get creative, and let us know what you think.

πŸ”— Links & Resources
πŸ“š Learn more about the Icon Wizard: [https://docs.fontawesome.com/web/add-icons/icon-wizard/v2]
✨ Conjure the Icon Wizard: [https://fontawesome.com/icons/wizard]

Susan Kare designed the original Mac's wait cursor concepts with a $2.50 sketchbook and a 32x32 pixel grid. Same method she used for the floppy disk save icon.

She is quietly responsible for a shocking amount of what you've stared at while a computer thinks.

Beach Ball of Death: The Ghost of a $10K Failed Computer

You've seen it a thousand times: you're two minutes late for a video conference call, you throw on a shirt with buttons (It's okay that you're still wearing jammie pants. Don't worry, nobody can see), and right when you need your computer most, that colorful spinning ball shows up to ruin your day. It's called a lot of things, but most of us just call it a curse word.

Today we trace the beach ball of death back to its actual origin story, which involves a $10,000 computer that flopped commercially, Steve Jobs in exile, a forgotten storage format, and Susan Kare's sketchbook. Turns out the most hated icon in computing has a surprisingly great pedigree.

We also get into why the beach ball exists at all (psst: it's your OS parenting a misbehaving app), how it could've been a spinning slice of pizza, and why Apple Silicon might be quietly killing it off for good.

**
What We Cover**

  • How much of life is spent waiting on machines, and why the frustration doesn't stop when you sit down at your computer
  • The Xerox PARC origins of the "wait" cursor and Susan Kare's contributions at Apple
  • Windows 95 and the golden age of customizable cursors (RIP, dancing banana)
  • The lineage from hourglass to wristwatch to spinning disk to beach ball to flat ring
  • How NeXT, the company Steve Jobs founded after leaving Apple, gave us the beach ball's true ancestor
  • Why Apple's 1996 acquisition of NeXT brought the spinning cursor along with it
  • How Aqua and Mac OS X turned a monochrome disk icon into a glossy rainbow ball
  • The many names for the beach ball, including the delightfully specific "bun of death"
  • Why the beach ball is becoming rarer on modern Macs, and what that means for a whole generation of users

**
Timestamps**

00:00 - Cold open: the dreaded beach ballΒ 

01:00 - Welcome to Podcast AwesomeΒ 

01:15 - How much of our lives we spend waiting on machinesΒ 

02:00 - Xerox PARC and the first "please wait" cursorΒ 

02:30 - Susan Kare's contributions to the original MacΒ 

03:30 - Windows 95 and the era of customizable cursorsΒ 

05:00 - The full lineage: hourglass to beach ball to flat ringΒ 

05:30 - Enter NeXT, Steve Jobs's post-Apple companyΒ 

06:00 - The $10,000 computer nobody could affordΒ 

07:00 - Apple acquires NeXT, and the spinning disk comes alongΒ 

08:00 - The beach ball as an OS parenting a misbehaving appΒ 

09:30 - Aqua, Mac OS X, and the rainbow makeoverΒ 

11:30 - Every alias for the beach ball, including the "bun of death"Β 

13:00 - How Apple Silicon is making the beach ball appearance rarer

3:45 - Closing thoughts and credits

**
Credits**

**
Sources Referenced**

Erin J. Rimmer's "The Utterly Obscure History of the Computer Cursor" on Obsolete Technology

Dan Vincent's "What's Inside a NeXT Computer Accessory Kit?" on Userlandia

Stay up to date on all the Font Awesomeness!

The Icon Wizard now does stacking, shape combining, resizing, nudging. Pretty much everything (except make you a sandwich. We've tried). So, the next obvious move: create an Icon Wizard contest! ✨

Build something in the Icon Wizard, submit it to the gallery, win a free year of Pro!

Get to building β†’ https://fontawesome.com/icons/wizard
Read the blog for more details β†’ https://blog.fontawesome.com/build-an-icon-nobodys-ever-made-and-then-show-it-off/

Icon Wizard 2.0

Icon Wizard 2.0 lets you combine and remix icons, build custom characters, and add your creations straight to a Kit.

A wizard arrives precisely when he means to, and Icon Wizard 2.0 has arrived. Combine and remix icons into something all your own: stack on modifiers and elements, or conjure a custom character in the User Blender. Then drop your creation straight into your Kit, download it, or share it with a link. Try the Icon Wizard or read the docs.

The 404 Error Code Has a Secret Origin Story

Picture this serious, sterile scene: scientists in lab coats, pocket protectors, carrying clipboards, and nobody’s making eye contact. Nobody would guess that this backdrop would produce some of the best internet lore.

In this episode, we dig into the myth that the 404 error page came from "Room 404" at CERN, track down what a co-creator of the web actually had to say about it, and land on the real, much more boring origin. Along the way we detour into the HTTP status code that was invented as an April Fools' joke, then defended by the developer community hard enough that it got its own RFC. We close it out with a tour of the internet's best 404 pages, including a deep dive into Font Awesome's own, with Jory Raphael.

What We Cover

  • The Room 404 myth: how it started, why it spread, and why Robert Cailliau, one of the actual creators of the web, wants nothing to do with it
  • The real, much less exciting origin of the 404 status code
  • Why HTTP works like a librarian with no short-term memory
  • Larry Masinter's HTCPCP proposal and the accidental birth of the 418 "I'm a teapot" code
  • How the dev community fought to save 418 when the IETF tried to reclaim it
  • A tour of the internet's best 404 pages: GitHub, Pixar, Lego, and Figma
  • Behind the scenes of Font Awesome's own 404 pages with Jory Raphael, including the Ghostbusters, Planes, Trains and Automobiles, Star Wars, and Mario references hiding in them
  • The Easter egg hiding on the Font Awesome icons page (and another one on Blog Awesome)

Timestamps

  • 00:00 – Cold open: if particle physics research is this serious, how did it produce such a goofy myth?
  • 01:00 – Intro to the episode and the CERN backstory begins, where human "servers" fetched documents by hand
  • 03:00 – How the Room 404 legend took hold, per Wired's reporting
  • 04:00 – Robert Cailliau's one-word review of the myth: "Sigh"
  • 05:00 – The actual, much more mundane origin of the 404 code, plus the DMV and librarian analogies
  • 07:00 – Larry Masinter, RFC 2324, and the Hypertext Coffee Pot Control Protocol
  • 08:00 – The community backlash when the IETF tried to reclaim status code 418
  • 09:00 – Shane Brunswick's save418.com stand, then back to great 404 pages: GitHub's Octocat
  • 10:00 – Pixar's Inside Out 2 tie-in 404
  • 11:00 – Lego's "oh, bricks" 404 and Figma's interactive one
  • 12:00 – Font Awesome's own 404 pages, including the Susan Kare bomb-icon origin story
  • 13:00 – The Ghostbusters Easter egg
  • 14:00 – The Planes, Trains and Automobiles reference and Brian's hidden hand-wave Easter egg
  • 15:00 – Star Wars references and the FA-ndolorian
  • 16:00 – The Mario reference, the icons page Easter egg, and the old Blog Awesome 404s, including "Where's my sandwich?"
  • 17:00 – A shoutout to Brian, the mind behind Font Awesome's 404 copy, and the outro begins
  • 18:00 – Closing credits and sign-off

Credits

Hosted by Matt Johnson

Featuring Jory Raphael

Produced and edited by Matt Johnson

Theme song by Ronnie Martin

Music interstitials by Zach Malm

Video editing by Isaac Chase

Links

#PodcastAwesome #404Error #WebHistory #InternetLore #TechTrivia #HTTPStatusCodes #FontAwesome #DesignPodcast

Stay up to date on all the Font Awesomeness!

@11ty/gray-matter@3.0.0

Parse front-matter from a string or file. Fast, reliable and easy to use. Parses YAML front matter by default, but also has support for YAML, JSON, TOML Front-Matter, with options to set custom delimiters. Used by metalsmith, assemble, verb and many other

Case study in brand consistency, starring my dog: he wags his tail for Starbucks before he's close enough to see the sign. No one primed him. The consistent experience did that on its own. Humans respond the same way, minus the tail.

Anecdote from the post: my Shih-tzu can identify a Starbucks before I can. Not from the sign. From pure pattern recognition built on consistent experience. If a dog can learn your brand, your users are learning your brand, too.

Also in this one: the early App Store days of one-off apps that were just what they were (RIP the beer-drinking app), and whether that fun, tinkerer spirit can come back now that side projects are cheaper to ship.