fading colour background 4 ur profile!!!!

HAI! do u want to have your profile have the same fading in and out colour thingie like mine?!?!?! (check my profile if u dk what i'm talking abt) well herez teh code so u dont have to fuck around and find out liek i did!!! 


notes; sorry if you get confused by the way i explain, i'm not very good with english sometimez


.profile {
  width: 100%;
  height: 100%;
  animation: pulse 7s infinite;
}

^^^
seperate with <style></style>

@keyframes pulse {
  0% {
    background-color:(insert colour* 1);
  }
  50% {
    background-color:(insert colour* 2);
}
 100% {
    background-color:(insert colour* 3);
}

^^^
seperate with <style></style>

html,
body {
  height: 100%;
}

^^^
seperate with <style></style>

main .left {
  width: 100%;
  height: 100%;
  animation: pulse 7s infinite;
}
 
^^^
seperate with <style></style>

@keyframes pulse {
  0% {
    background-color:(insert colour* 1);
  }
  50% {
    background-color:(insert colour* 2);
}
 100% {
    background-color:(insert colour* 3);
}

^^^
seperate with <style></style>

html,
body {
  height: 100%;
}

^^^
seperate with <style></style>

*NOTEZ:
for starterz, all teh areaz i divided with "seperate with <style></style>" need to be put INBETWEEN <style></style>, liek put the code right between the "><" yk, or else it wont register that ur tryna do somethin. now to the more importain thingz:::

ok, if u want a colour to fade in and out like mine doez, you need to do az followz:
1)colour you want it to start az
2)colour you want it to fade to
3)either put it az the colour in the first animation bit if u want a repeating, smooth loop like mine, or if u want it to be leik a rainbow or jus want it to have more that two colourz, it will be a bit tricky due to the fact you wpould need to do a bit of division, because the 0% 50% and 100% are for the framez in the animation, if u get what i mean, so you would need to calculate a bit to figure out how to evenly put the framez. or dont, if u dont care abt it being a little wonky XP 

herez an example of even framez (thiz is five framez):


@keyframes pulse {
  0% {
    background-color:(insert colour* 1);
  }
25% {
    background-color:(insert colour* 2);
  }
  50% {
    background-color:(insert colour* 3);
}
  75% {
    background-color:(insert colour* 4);
  }
 100% {
    background-color:(insert colour* 5);
}

seperate with <style></style>

html,
body {
  height: 100%;
}

seperate with <style></style>

now you can also put the code wherever u want by replacing the ".profile" or "main .left" with wherever you want it to be, and thatz pretty much it! hope yall get somethin outa thiz, ik i'm probably not the first one to discover thiz nor iz this the coolest thing on thiz website (people literally have profilez that are floating around n shit?!?!?! 0_o im still trying to figure it out... wizardry...) but i hope i helped someone with thiz


7 Kudos

Comments

Displaying 0 of 0 comments ( View all | Add Comment )