html master post!!

text shadow

<style>

p {

  color: **;

  text-shadow: **px **px **px color;

</style>

blog titles

<style>

.blog-entry .title {

  font-size: **px;

  color: **; 

  text-spacing: normal;

  text-shadow: **px **px **px color;

</style>

background 

<style>

body{

background-image:url(https://i.pinimg.com/564x/c3/cf/2f/c3cf2f6bffb032b4b68762b91e5fcfe6.jpg);

color: white;

background-size: 700px;

</style>

to change colors for interest sections

<style>

:root {

--logo-blue: #e875b0;

--darker-blue: #e20c87;

--lighter-blue: #e20c87;

--even-lighter-blue:#ffc6d1;

--lightest-blue: #fea9d3;

--dark-orange: #d3117b;

--light-orange: #ffa8d3;

--even-lighter-orange: #fdaaba;

--green: #fdaaba;

--red: #ff009b;

</style>

change footer color

<style>

footer{    

background-color: black;    

</style>

change notification icon

<style>

 .icon {

    content:url(**);

    width: **px;

    height: **px;

    visibiliy: ;

</style

change main background color

<style>

main {

    background: black;

}

</style>

ong can’t remember what this is for so js mess around with it

<style>

    ::-webkit-scrollbar {

    width: 10px;

    height: 10px;

    }

    ::-webkit-scrollbar-thumb {

    background: #e875b0;

    }

    ::-webkit-scrollbar-track {

    background: black;

    }

</style>

change online ickn

<style>.online { visibility: hidden; } .online img { content: url("**"); animation-name: none; visibility: visible; height: 50px; width: 200px; }</style>

make pfp rotate

<style> 

@keyframes spin{

  from{ transform:rotate(0deg); }

  to{ transform:rotate(-360deg); }

}

.general-about .profile-pic img{

  border-radius: 50%;

  animation: spin 7s infinite linear;

</style>

make pfp heart shaped

<style>

.general-about .profile-pic img{

-webkit-mask-image: url(https://i.imgur.com/bAxhHPN.png);

-webkit-mask-size: 100%;

-webkit-mask-repeat: no-repeat;

-webkit-mask-position: center;

transform:scale(1.025,1.025);

position:relative;

top:-0.25em;

</style>

to change icons in contact box

<style>

.contact .inner a img {font-size: 0;}

.contact .inner a img:before {font-size: 1em;display: block;}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {content:"emoji"}

/*ADD TO FRIENDS*/

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {content:"emoji"}

/*ADD TO FAVORITES*/

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {content:"emoji"}

/*SEND MESSAGE*/

</style> 

film grain effect

html:before {
  animation: grain 8s steps(10) infinite;
  background-image: url(https://i.imgur.com/QpnTsrV.jpg);
  content: "";
  height: 300%;
  left: -50%;
  opacity:.2;
  position: fixed;
  top: -110%;
  width: 300%;
  pointer-events:none;
}
@keyframes grain {
  0%, 100% { transform:translate(0, 0) }
  10% { transform:translate(-5%, -10%) }
  20% { transform:translate(-15%, 5%) }
  30% { transform:translate(7%, -25%) }
  40% { transform:translate(-5%, 25%) }
  50% { transform:translate(-15%, 10%) }
  60% { transform:translate(15%, 0%) }
  70% { transform:translate(0%, 15%) }
  80% { transform:translate(3%, 35%) }
  90% { transform:translate(-10%, 10%) }
}

to add blinkies

<a href="website the blinkies from" target="_blank"><img src="direct link to blinkies">

to make profile comments scrollable

.comments-table{

display: block;

height: 400px;

overflow-y: scroll;

to add character to screen

main:before {

    content: url(https://iili.io/HAKIb9t.png);

    position: fixed;

    bottom: -40px;

    right: -30px;

    transform: translateX(-3vw) translateY(-6vh);

    pointer-events: none;

to add stamps/gifs

<img src="url" width="110" height="70"/>

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {content:"emoji"}

/*FORWARD TO FRIEND*/

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {content: "emoji"}

/*INSTANT MESSAGE*/

.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {content: "emoji"}

/*BLOCK USER*/

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {content: "emoji"}

/*ADD TO GROUP*/

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {content: "emoji"}

/*REPORT PROFILE*/

}

to change contact box background

    .contact{
        
    background-color: COLOR !important;
or
    background-image: url('URL') !important;
adding video (havent tested)
<video src="video.mp4" controls></video>
adding rotating affect to an element(havent tested)
<style>
  .rotate {
    animation: spin 2s infinite linear;
  }

  @keyframes spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
</style>

<div class="rotate">I'm rotating!</div>
upside down text
<p style="transform: rotate(180deg);">Your upside-down text here</p>
blinking text
<p style="animation: blink 1s infinite;">Your blinking text here</p>

<style>
  @keyframes blink {
    50% {
      opacity: 0;
    }
  }
</style>
rainbow text
<p style="background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">Your rainbow text here</p>
moving text (havent tested)
<p style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); animation: move 3s infinite;">Your moving text here</p>

<style>
  @keyframes move {
    0% {
      transform: translate(-50%, -50%);
    }
    50% {
      transform: translate(-50%, -30%);
    }
    100% {
      transform: translate(-50%, -50%);
    }
  }
</style>
inverted colors (havent tested)
<p style="filter: invert(1);">Your inverted text here</p>
to add other interest boxes
<td>
    <p>title</p>
  </td>
  <td>
    <p>content</p>
      </div>
  </td>
drop down thingy

<details>
< summary>sample text< /summary>
sample text
</details>
add another blurb
<td>
    <p>title</p>
  </td>
  <td>
    <p>info</p>
      </div>
  </td>
to make profile float
<style>
.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 4s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 4s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
@keyframes float {
0% {
transform: translate(0, 0px);
}
50% {
transform: translate(0, 8px);
}
100% {
transform: translate(0, -0px);
}
</style>
sites i rec
creating a user box
mainly pink stamps
graphics
blinkie blog 1
blinkie blog 2
stamp blog
blinkie cafe
blinkie carrd
kawaii resources
blinkie blog 3
mainly pink graphic blog
cat gifs blog
gif collection
geo blinkies
webpage gaurdiam
glitter graphics
fonts
layout preview
blinkie maker
create text gif
button maker
gif maker
image hoster1
image hoster 2
mainly pink graphics 2
web buttons
caitlynns masterpost