---- Dax's PC ----
Collection of all the fakemon sprites I have in Pokédex order.
I will be updating this the more fakemon I make, even if their full dex entry isn't done yet.
NOTE: Best viewed on PC.
Click sprite to view shiny variant
I wanna try make a habit of writing these when I learn about code that can be useful or fun for others to use!
I like using this persona for this cause Pokémon professors are supposed to be nerds
This code lets you toggle between 2 images when clicked. Like the example my amazing Chonkmesa is giving.
This is the style code, you will need access to style tags for this to work.
<style>
#pkdex{
display: inline-block;
cursor: pointer;
}#pkdex input,
#pkdex input:checked + img,
#pkdex input:not(:checked) + img + img {
display: none;
}
</style>
And here is the element that holds the images, you can edit its placement by wrapping it in a <div> and messing with margins and such or add a "style=" to the label tag
<label id="pkdex" class="m-0">
<input type="checkbox" />
<img src="1st IMAGE URL HERE" style="height:200px;"/>
<img src="2nd IMAGE URL HERE" style="height:200px;"/></label>
You can move this label element essentially the same way you´d move an <img>, and to my knowledge you can only toggle between 2 images this way, and not more. (feel free to correct me if I'm wrong)
Lore about this code:
I wanted a way to swap between Normal and Shiny sprites for my Pokédex entries, so naturaly I set out to the internet to see if it was possible with basic HTML and CSS.
I learned that "Yes. Sorta" was the answer, and got dragged down the checkbox rabbit-hole
After struggling for an hour(s) to get what I had (which was only kinda working) in a better state and failing... I reached out and @Ry ended up fixing it so it works and looks nice the end, so shoutout to him for being a nerd.
I got bored so I wrote this up
This template is mostly for myself but feel free to use if you want :)
it's simple code the bulk of which is stolen of the internet somewhere and modified.
HP
[046]
ATK
[053]
DEF
[045]
Spc.ATK
[069]
Spc.DEF
[042]
SPEED
[060]
This is where you can change the border and the colour of the progress bar - I have it in a somewhat rounded style but you don't have to.
<style>
progress {
flex-shrink:1;
border-radius: 50px;
width: 60%;
height: 10px;}
progress::-webkit-progress-bar {
background-color: black;
border-radius: 50px;
}progress::-webkit-progress-value {
background-color: #78678a ;
border-radius: 50px;}
</style>
Each section devided by the "--" is a single progress bar, here is were you can change the stat it represents and the "value".
The max (currently set to the Pokémon stat max) is how it calculates how far the value will be coloured on the bar, so if the max is 100 and you say the value="50" then thats the same as 50%
Example
[50%]
<div class="flex flex-nowrap justify-center" style="align-items:center;">
<p class="m-0" style=" margin-right:86px;"> HP </p>
<progress class="m-0" value="46" max="255"> </progress>
<p class="m-0">[046] </p>
</div>--
<div class="flex flex-nowrap justify-center" style="align-items:center;">
<p class="m-0" style=" margin-right:71px;"> ATK </p>
<progress class="m-0" value="53" max="255"> </progress>
<p class="m-0">[053] </p>
</div>--
<div class="flex flex-nowrap justify-center" style="align-items:center;">
<p class="m-0" style=" margin-right:71px;"> DEF </p>
<progress class="m-0" value="45" max="255"> </progress>
<p class="m-0">[045] </p>
</div>--
<div class="flex flex-nowrap justify-center" style="align-items:center;">
<p class="m-0" style=" margin-right:10px;"> Spc.ATK </p>
<progress class="m-0" value="69" max="255"> </progress>
<p class="m-0">[069] </p>
</div>--
<div class="flex flex-nowrap justify-center" style="align-items:center;">
<p class="m-0" style=" margin-right:10px;"> Spc.DEF </p>
<progress class="m-0" value="42" max="255"> </progress>
<p class="m-0">[042] </p>
</div>--
<div class="flex flex-nowrap justify-center" style="align-items:center;">
<p class="m-0" style=" margin-right:41px;"> SPEED </p>
<progress class="m-0" value="60" max="255"> </progress>
<p class="m-0">[060] </p>
</div>
If you want to have multiple colours or styles then you will need to add a "." to "progress" and add a number.
You will need to insert <class="progress(number you changed it to)> to the bar element.
Style Ex
[50]
Style Ex
[50]
<style>
.progress2 {
flex-shrink:1;
border-radius: 50px;
width: 60%;
height: 10px;}
.progress2::-webkit-progress-bar {
background-color: black;
border-radius: 50px;}
.progress2::-webkit-progress-value {
background-color: yellow ;
box-shadow: 1px 1px 5px 3px rgba( 255, 214, 110, 0.8 );
border-radius: 50px;
}--
.progress3 {
flex-shrink:1;
border-radius: 0px;
width: 60%;
height: 20px;}
.progress3::-webkit-progress-bar {
background-color: #001640;
border-radius: 0px;}
.progress3::-webkit-progress-value {
background-color: turquoise ;
border-radius: 0px;}
</style>
<div class="flex flex-nowrap justify-center" style="align-items:center;">
<p class="m-0" style=" margin-right:72px;"> Glow Ex </p>
<progress class="progress2" class="m-0" value="50" max="100">
<p class="m-0">[50] </p>
</div>--
<div class="flex flex-nowrap justify-center" style="align-items:center;">
<p class="m-0" style=" margin-right:41px;"> Colour Ex </p>
<progress class="progress3" class="m-0" value="50" max="100"> </progress>
<p class="m-0">[50] </p>
</div>
As a final note, if you want it to have this font for the maximum Pokémon feel and vibes then just include this:
<style>
@font-face { font-family: pokefont; src: url('https://file.garden/ZnGZOv7aF21WeO00/Fakemon/Pokemon GB.ttf'); }p {
font-family: pokefont;
font-size: 12px;
}</style>
Careful though, it will turn all of your text to this font unless specified otherwise.
And thats everything, I'm not the smartest with HTML and I'm still learning, but I thought this was a fun thing people can use to decorate their profile with.
This can be placed anywhere HTML is allowed, including literature pieces,example here
TEMPLATE
Images are optional - I know they take a while to add in :3
I used this website to easily help me pick and sort through my choices: https://cajunavenger.github.io/
Tell me what your favourite Pokémon is in each Generation in this order:
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
Generation 1
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
Generation 2
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
Generation 3
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
Generation 4
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
Generation 5
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
Generation 6
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
Generation 7
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
Generation 8
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
Generation 9
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
BONUS
Tell me your 3 favourite Hisui Pokémon
Pokemon - Pokemon - Pokemon
If there was one Pokémon you could erase from existance, which one would it be?
The correct answer is Mousehold

OPTIONAL: Share a Pokémon or fakemon you have drawn recently!
Insert Image here - don't forget a link!
Challenge exactly 18 friends to do this meme too! (if you want) - You can find the template version of this meme HERE
That's all Pokéfriends!
You can find my completed journal HERE :)
I wanted an excuse to talk more about the Pokémon I like and I couldn't find another meme so, "fuck it, I'll do it myself" as they say.
I used this website to easily help me pick and sort through my choices: https://cajunavenger.github.io/
Tell me what your favourite Pokémon is in each Generation in this order:
Normal - Fire - Water - Grass - Electric - Ice - Fighting - Poison - Ground - Flying - Psychic - Bug - Rock - Ghost - Dragon - Dark - Steel - Fairy
Generation 1
Meowth - Arcanine - Vaporeon - Ivysaur - Jolteon - Lapras - Primape - Tentacruel - Cubone - Charizard - Slowbro - Beedrill - Aerodactyl - Gengar - Dragonair - SUBSTITUTE - Magnemite - Clefairy
Generation 2
Smeargle - Cyndaquil - Suicune - Celebi - Raikou - Piloswine - Heracross - Ariados - Quagsire - Murkrow - Giragarig - Scizor - Tyranitar - Misdreavus - Kingdra - Umbreon - Skarmory - Grandbull
Generation 3
Skitty - Blaziken - Mudkip - Cacnea - Plusle - Spheal - Breloom - Seviper - Swampert - Rayquaza - Deoxys - Armaldo - Aggron - Sableye - Flygon - Absol - Jirachi - Gardevoir
Generation 4
Bidoof - Monferno - Gastrodon (blue) - Torterra - Luxray - Glaceon - Lucario - Roserade - Garchomp - Honchkrow - Gallade - Vespiquen - Cranidos - Mismagius - Dialga - Wevile - Empolion - Togekiss
Generation 5
Braviary - Tepig - Ducklett - Veavanny - Joltik - Kyurem - Scraggy - Scoliopede - Krokorok - Archen - Reuniclus - Volcarona - Crustle - Litwick - Reshiram - Zorua - Bisharp - Whimsicott
Generation 6
Fletchling - Delphox - Greninja - Gogoat - Heliolisk - Bergmite - Pancham - Dragalge - Zygarde - Noibat - Espurr - Spewpa - Tyrantrum - Phantump - Noivern - Pangoro - Honedge - Sylveon
Generation 7
Silvally - Marowak - Popplio - Lurantis - Xurkitree - Ninetales - Marshadow - Salandit - Mudsdale - Rowlet - Cosmog - Golisopod - Lycanroc - Mimikyu - Drampa - Meowth - Solgaleo - Ribombee
Generation 8
Bubwool - Centiskorch - Dredmaw - Appletun - Toxtricity - Glastrier - Clobbopus - Weezing - Sandaconda - Corviknight - Ponyta - Orbeetle - Stonjourner - Dragapult - Dracozolt - Nickit - Zacian - Hatterene
Generation 9
Ursaluna - Ceruledge - Walking Wake - Sprigatito - Miraidon - Artibax - Slither Wing - Clodsire - Great Tusk - Iron Jugulis - Espathra - Nymble - Garganacl - Flutter Mane - Tatsugiri - Lokix - Orthworm - Iron Valiant
BONUS
Tell me your 3 favourite Hisui Pokémon
Zorua - Arcanine - Ursaluna
If there was one Pokémon you could erase from existance, which one would it be?
The correct answer is Mousehold

I hate this thing.
OPTIONAL: Share a Pokémon or fakemon you have drawn recently!
Challenge exactly 18 friends to do this meme too! (if you want) - You can find the template version of this meme HERE
That's all Pokéfriends!