Ahmad Awais



Why You Should Never Use Colored Icons Inside the WP Admin Panel

Ahmad AwaisAhmad Awais


This is going to be a short post because I’ll try to keep it on point. WordPress has an ecosystem. When you enter that ecosystem, you gotta respect its rules; you gotta make an effort to be a part of the community, and you should try to improve the product user experience while you’re at it.

Remember that kid from your time at school who never really understood how to be a part of the cool kid’s group? Especially, during summer camps when there was no uniform condition to abide by, he wore the oddest of the clothes. Yup, it was that time in our lives when standing outside the crowd meant you are a weirdo geek or something.

Same is the case with WordPress. You see, WordPress core doesn’t have everything you need to build your custom website with. That’s why there exists a concept of plugins. Plugins are supposed to extend WordPress. Now, I am not talking about API based plugins which connect a SaaS platform with WordPress. I am talking about little plugins which add an extra functionality in your WordPress admin panel.

You see I was a UX designer who later converted from frontend of the web to a full stack developer. But that designer part inside me never really went away. I find it hard not to judge a book by its cover. In case of WordPress plugins, I judge your programming practices with these teeny tiny mistakes.

Responsible Extension of WordPress Admin Panel#

I guess what I am trying to say is that when you build a small WordPress plugin, that extends a feature inside our WordPress Admin panel, you should be very careful about the list of following factors.

⚡️ Never use colored icons inside the admin panel! It’s true, and I can’t tell you how many plugin developers ignore this one. When you add a menu for your plugin or when you add an extra feature in the WP editor’s TinyMCE bar; in both the cases you get to add an icon for your menu or the feature. You have the option to be a responsible developer here. Adding a colored icon disturbs everything for someone like me.

It’s very hard to focus and write something when your editor has more colors inside it than a friggin’ rainbow.


See how funny the TinyMCE bar looks when you break the flow of design and choose to embed colorful unicorns inside it? I for one cannot stand it. Here’s another one.


See, how bad it looks? Yucks! I wanted to use this ThirstyAffiliates plugin but having to look at these two greenish icons made me write off the plugin in the very first week. I don’t even know how to explain this thing. But to me, it looks like you threw up over the UI and thought — Yeah, that looks nice!

⚡️ Never put colored icons in the admin menu bar! Some plugin developers believe that they are doing some kinda favor to their users by putting a big pixelated piece of junk right inside the admin menu bar. What? Too much? Did I just say that out loud? What’s done is done now. I hate to break it to you, but can you please stop ruining the WordPress admin panel?


See what I am talking about? In the collection of 7 custom plugins, all of the plugins except one kept their icons in line with WP admin panel design. See how cool they look? And can you spot the pixellated, ultra-visible (read ultra-hateful) blue-colored icon for WP-Optimize? That said, it’s a pretty great plugin. I use it all the time.


Oh, this again. Look at how bad that greenish icon looks the one for Affiliate Links. It’s the deal breaker for me. Couldn’t stand all the great features which this plugin had to offer due to the poor choice of silly colored-icons.

Speak Away!#

I hope I have not hurt your feelings, oh did I? Maybe I should? WordPress developers need a reality check. And don’t you even get me started at if your plugins should create a separate menu or just reside as a sub menu inside tools/setting menu. Seriously, don’t.


[UPDATE]: I like and use the plugins that I mentioned in this article. The only thing that I don’t like about them is their colored icons. I hope no one has any funny ideas about this troll. It is NOT meant to disgrace or disrespect anyone. #FoodForThought

I help businesses understand developers 📟 Launching Node.js CLI Automation Course 👨‍🏫 Edutainer at VSCode.pro 🎩 An award-winning open-source engineer and developer advocate 🦊 Google Developers Expert for web 🌳 Node.js foundation Community Committee member ✌️ Author of various open-source dev-tools and software libraries used by millions of developers worldwide ⓦ WordPress Core Developer 📣 TEDx Speaker 🙌 Leading developers and publishing technical content for over a decade 😂 Self-confessed tech comedian working with the JavaScript web and cloud communities 💜 Loves his wife (Maedah) ❯ Learn more about Awais ↣

Say 👋 on Twitter @MrAhmadAwais | Subscribe to the Developers Takeaway!


Developers Takeaway

Takeaway my professional opinion on open-source, developer relations, growing your business with family, and everything in between! Delivered to your inbox a couple of times every year. I'm even funny at times. I hate spam — pinky-promise!

👨‍💻👩‍💻 115,834 Developers Already Subscribed