Dianastenism's profile picture

Published by

published
updated

Category: Web, HTML, Tech

Brawl stars - Angelo themed Layout (first ever Layout I posted here)

<style>

.logo {


content:url(https://cdn.discordapp.com/attachments/1209519170274988132/1269404228519198740/test.png?ex=66aff050&is=66ae9ed0&hm=bbfda4f86a12d4b886924f3260cbd3cbfec94012914a98a7553be0cf9d15afdf&);


}

</style>


<style>

table table table td { vertical-align: top; !important; }

span.blacktext12 { visibility: visible !important; background-image: url('http://dl4.glitter-graphics.net/pub/229/229724jl2i22oq6z.jpg'); background-repeat: no-repeat; background-position: center center; background-color: transparent; font-size: 0px; letter-spacing: -0.5px; width: 435px; height: 75px; display: block !important; }

span.blacktext12 img { display: none; }

</style>


<a href="https://www.glitter-graphics.com"><img src="http://dl6.glitter-graphics.net/pub/447/447826eewa4rjleq.gif" width="440" height="35"/></a><br/>


 <marquee behavior="scroll" direction="right">

    <img src="https://media.tenor.com/8AqGV1N7rmwAAAAi/soyjack.gif" width="120" height="80" alt="Natural"/>


</marquee>


<img src="https://static.wikia.nocookie.net/brawlstars/images/c/cf/Angelo2-pfp.png/revision/latest?cb=20240228103613"/>

<img src="https://static.wikia.nocookie.net/brawlstars/images/9/95/Angelo1-pfp.png/revision/latest?cb=20240229104448"/>

<img src="https://static.wikia.nocookie.net/brawlstars/images/1/14/Angelo_Hypercharge-pfp.png/revision/latest?cb=20240624223059"/>


<a href="https://www.glitter-graphics.com"><img src="http://dl8.glitter-graphics.net/pub/668/668028hg6b94j4ek.gif" width="60" height="80"/></a>


<a href="https://www.glitter-graphics.com"><img src="http://dl6.glitter-graphics.net/pub/447/447826eewa4rjleq.gif" width="440" height="35"/></a><br/>


<style>

body {

    background: url(https://i.pinimg.com/564x/51/55/f6/5155f6b6514378f4afb3e171bf02f7a2.jpg);

}


</style>



Background music: Brawl Stars Theme - The Swamp of Love (#1)

<iframe width="0" height="0" src="https://www.youtube.com/embed//jsCt9dFRSxg?si=Y5E2F05oVmbhRI5y//?&;amp;;autoplay=1&;loop=10&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">


</iframe>


<style>* {cursor: url(https://cur.cursors-4u.net/symbols/sym-1/sym34.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2005/05/03/sym34.html" target="_blank" title="Sagittarius - Zodiac Sign"><img src="https://cur.cursors-4u.net/cursor.png" alt="Sagittarius - Zodiac Sign" style="position:absolute; top: 0px; right: 0px;"/></a>


<style>

body:before {

content: " ";

height: 100vh;

width: 100vw;

display: block;

position: fixed; 

top: 0; 

left: 0; 

z-index: 100;

background-image:url(https://media1.tenor.com/m/SAZITu4sqZUAAAAd/brawl-stars-angelo.gif);

background-size: cover;

background-repeat: no-repeat;

background-position:center;

animation: yourAnimation 3s ease 0s 1 normal forwards;

pointer-events: none;

}

@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }


</style>


<style>

@import url('https://fonts.googleapis.com/css2?family=Cute+Font&display=swap');

  p{   

     font-family: 'Cute Font', cursive;

     font-size: 25px;

     color: purple

 }   

</style>


<style>

main:before {

    width: auto;

    margin-bottom: 25px;

    border: 1px purple;

    height: 125px;

    display: block;

    content: "";

    box-shadow: 0px 0px 5px 1px #7e6cb8;

    background-image: url(https://i.pinimg.com/736x/84/e9/81/84e9811dd2cdbd7bbe18d9592bd062e9.jpg);

    background-position: center center;

    background-size: cover;

}</style>


<style>

footer {

    border-radius: 15px;

    background-image: url(https://i.pinimg.com/736x/84/e9/81/84e9811dd2cdbd7bbe18d9592bd062e9.jpg);

    

}</style>



<style>

:root {

    --logo-purple:#7e6cb8;

    --darker-purple: #614f9c;

    --magenta: #614f9c;

    --dark-green: #0d6e3c ;

    --lightest-green: #8ceda4 ;

    --green: #19b51f;

    --light-blue: #3c0e40;

    --even-lighter-green: #9ff5a1;

    --blue: ;

}</style>



<style>

.profile .profile-info {

background-image: url(https://i6.glitter-graphics.org/pub/1069/1069696u5bz28q735.gif);

padding: 20px;

border: none;

border-radius: 10px;

box-shadow: 4px 4px 0 #FDCAE0;

text-align: center;

animation: nineties2 2s ease 0s infinite normal none;

animation-delay: .15s;

border: none;

}

}</style>



<style>

.general-about {

background-image: 

url

(https://i9.glitter-graphics.org/pub/471/471089gg8033v77w.jpg);

padding: 35px;

border-radius: 47px;

box-shadow: 4px 4px 0 #FDCAE0;

text-align: center;

animation: nineties2 2s ease 0s infinite normal none;

animation-delay: .46s;

}</style>


<style>

.profile .blurbs .section :nth-child(2) {

background-image: url(https://i7.glitter-graphics.org/pub/479/479517d7b20sf4jy.gif);

     /* margin-top: -5px; */

padding: 18px;

box-shadow: 4px 4px 0 #000;

}

</style>



<style>

.contact {

  border-radius: 8px;

  background-image: url(https://i2.glitter-graphics.org/pub/99/99472znutl5jkwj.gif);

  background-position: left bottom;

  background-repeat: repeat;

background-attachment: scroll;

Width: 310px;

Height:180px;


color: pink;

  text-shadow: 1px 1px 2px #FDCAE0, 0 0 25px #FDCAE0, 0 0 3px #FDCAE0; 

}</style>



<style>

.profile {

background-image:url(https://i5.glitter-graphics.org/pub/2726/2726625rm88ryuk92.gif);

  background-repeat: repeat;

    border-radius: 12px;

}</style>



<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 {

/* Add to Friends */

content: "☆"

}

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

/* Add to Favorites */

content: "☆"

}

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

/* Send Message */

content: "☆"

}

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

/* Forward to Friend */

content: "☆"

}

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

/* Instant Message */

content: "☆"

}

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

/* Block User */

content: "☆"

}

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

/* Add to Group */

content: "☆"

}

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

/* Report Profile */

content: "☆"

}

</style>



0 Kudos

Comments

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