The Actual News:
Oh boy! So, yesterday I was bored, and so I decided to rip the type symbols which appears in Pokémon Sword/Shield, and then I turned them into site emoticons. Check it out!
Pretty nifty, huh? If you want to find out how to use the emoticons in the comments yourself, or if you just want to take a look at all the different type emoticons I made, head on over to the PA! Emoticon Guide page.
Now as for those of you who want to know about the colors used in the types… well, read on!
OK so while I was working on extracting the type symbols, I also managed to record the color data for each type. Turns out there are three colors involved: a “medium” color for the type symbol, a “dark” color for the type’s name, and a “light” color for attacks of that type.
You can see an example of what color goes where in the blank images below; the top is an example of the Pokémon’s type info, while the bottom is an example of the Pokémon’s attack. The white circle represents where the type symbol would go, while both images are colored in the three shades.
And so the below chart is the HTML code for all three colors for each of the 18 types. If other types show up—like the “???” type, which was programmed into the game as a fail-safe, going as far as programming a ???-type plate for Arceus—I’ll be sure to add it to the list. … Heck, I might actually make an entry for both ???-type and Bird-type just for the hell of it.
| SYMBOL | TYPE NAME | ATTACK | ||
 Bug |
#91c12c | #4d553e | #add080 |
 Bug
 Bug Attack |
 Dark |
#5a5467 | #44454a | #908d96 |
 Dark
 Dark Attack |
 Dragon |
#0c6cc4 | #374957 | #7a99cf |
 Dragon
 Dragon Attack |
 Electric |
#f4d43b | #5d5a42 | #f6dc85 |
 Electric
 Electric Attack |
 Fairy |
#ed91e3 | #5c4e5d | #f2adec |
 Fairy
 Fairy Attack |
 Fighting |
#ce4267 | #594149 | #d98698 |
 Fighting
 Fighting Attack |
 Fire |
#ff9d54 | #605043 | #ffb68d |
 Fire
 Fire Attack |
 Flying |
#90a9dc | #4d515a | #aebde4 |
 Flying
 Flying Attack |
 Ghost |
#526aad | #424953 | #8e97be |
 Ghost
 Ghost Attack |
 Grass |
#63bc5a | #445547 | #94cc8f |
 Grass
 Grass Attack |
 Ground |
#d97846 | #5b4940 | #e19f87 |
 Ground
 Ground Attack |
 Ice |
#73d0bd | #465858 | #9cdacd |
 Ice
 Ice Attack |
 Normal |
#909ca2 | #4c504f | #acb4b7 |
 Dark
 Dark Attack |
 Poison |
#a96ac9 | #524858 | #be98d5 |
Poison
Poison Attack |
 Psychic |
#fb717b | #5e484a | #fa9c9d |
 Psychic
 Psychic Attack |
 Rock |
#c6b88a | #58554e | #d3c8a8 |
 Rock
 Rock Attack |
 Steel |
#5a8fa3 | #444d52 | #90acb8 |
 Steel
 Steel Attack |
 Water |
#4e92d2 | #424e5a | #8cade0 |
 Water
 Water Attack |
That’s about it for that. Hopefully you found this information to be… well… informative.
3 Comments
There’s a notable difference in the type colors used in Gen 9, along with some changes to symbols. I’m wondering if you’re going to make a new version of this guide for Gen 9 now that the games have been out for a while.
Yep! A refresh is in the works. I also have plans to cover PLA as well.
That said, all the updates for the colors will be on the ColorDex page, while the symbol update will be on the Pokémon Fonts page. Be sure to keep an eye out for them!
Is the ColorDex page the most up to date on hexcodes then? I’ve noticed there’s some differences between the hexcodes listed on this page and the ones given on that page for gen8 type colors.
Ex:
ColorDex code for bug’s darkest hue: #4D5441
This page’s code for bug’s darkest hue: #4d553e
It’s not necessarily a huge difference, but it is distinct enough to cause a subtle mismatch in graphical designs, so I’m just curious which one should be the go-to for the most up to date codes (for Gen8 anyway).