<!-- cred. Cleverduck09 --> <div style="background:linear-gradient(aqua, hotpink); padding: 50px 50px; border-radius: 20px; border:100px double; border-image:linear-gradient(to top left, aqua, hotpink) 1"><big><big><big><b>CHERRY BLOSSOM DESIGN</b></big></big></big><br> <div style="background:aqua;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>INTRODUCTION</b></div> Content <div style="background:aqua;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>APPEARANCE</b></div> Content <div style="background:aqua;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>PERSONALITY</b></div> Content <div style="background:aqua;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>HISTORY</b></div> Content <div style="background:aqua;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>RELATIONSHIPS</b></div> Content </div>
Content
Content
Content
Content
Content
<!-- cred. Cleverduck09 --> <center><div style="background-color:black;background-image: radial-gradient(white, rgba(255,255,255,.2) 2px, transparent 40px), radial-gradient(white, rgba(255,255,255,.15) 1px, transparent 30px), radial-gradient(white, rgba(255,255,255,.1) 2px, transparent 40px), radial-gradient(rgba(255,255,255,.4), rgba(255,255,255,.1) 2px, transparent 30px); background-size: 550px 550px, 350px 350px, 250px 250px, 150px 150px; background-position: 0 0, 40px 60px, 130px 270px, 70px 100px; color: white;padding: 50px 20px; border-radius: 100px 100px"> <big><big><big><center><b>STARRY NIGHT DESIGN</b></center></big></big></big> <div style="background:white; color:black;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>INTRODUCTION</b></div> Content <div style="background:white;color:black;border-radius:40px;padding:10px 10px; opacity:50%"><big><b>APPEARANCE</b></big></div> Content <div style="background:white;color:black;border-radius:40px;padding:10px 10px;opacity:50%"><big><b>PERSONALITY</b></big></div> Content <div style="background:white;color:black;border-radius:40px;padding:10px 10px;opacity:50%"><big><b>HISTORY</b></big></div> Content <div style="background:white;color:black;border-radius:40px;padding:10px 10px;opacity:50%"><big><b>RELATIONSHIPS</b></big> </div> Content </div></center>
Content
Content
Content
Content
Content
<!-- cred. Cleverduck09, Lea Verou --> <div style="background:white; color: rgb(105,105,105,0.0); font-family: Impact; text-align:center; text-shadow:1px 0px 2px purple; padding: 20px 50px; border-radius: 50px;font-family:Unkempt"><big><big>Spray Paint Design</big></big> <div style="font-size: 20px"><div style="background:purple;border-radius: 40px; padding: 10px 10px; opacity: 50%; color:black"><b>INTRODUCTION</b></div> Content <div style="background:purple;border-radius: 40px; padding: 10px 10px; opacity: 50%; color:black"><b>APPEARANCE</b></div> Content <div style="background:purple;border-radius: 40px; padding: 10px 10px; opacity: 50%; color:black"><b>PERSONALITY</b></div> Content <div style="background:purple;border-radius: 40px; padding: 10px 10px; opacity: 50%; color:black"><b>HISTORY</b></div> Content <div style="background:purple;border-radius: 40px; padding: 10px 10px; opacity: 50%; color:black"><b>RELATIONSHIPS</b></div> Content </div></div>
Content
Content
Content
Content
Content
<!-- cred. Cleverduck09 --> <div style="background:black; color:white; font-family: Impact; text-align:center; padding:100px 100px; font-size: 50px; text-shadow:1px 2px 30px; text-shadow-color: white; padding: 20px 20px; border-radius: 50px;">GLOW DESIGN<br> <div style="font-size: 20px"><div style="background:white;border-radius: 40px; padding: 10px 10px; opacity: 50%; color:black"><b>INTRODUCTION</b></div> Content <div style="background:white;border-radius: 40px; padding: 10px 10px; opacity: 50%; color:black"><b>APPEARANCE</b></div> Content <div style="background:white;border-radius: 40px; padding: 10px 10px; opacity: 50%; color:black"><b>PERSONALITY</b></div> Content <div style="background:white;border-radius: 40px; padding: 10px 10px; opacity: 50%; color:black"><b>HISTORY</b></div> Content <div style="background:white;border-radius: 40px; padding: 10px 10px; opacity: 50%; color:black"><b>RELATIONSHIPS</b></div> Content </div></div>
Content
Content
Content
Content
Content
<!-- cred. Cleverduck09 --> <center><div style="background:linear-gradient(lightgray,#6699CC,#6699CC,#6699CC,#6699CC,#6699CC); border-radius: 100px;"><div style="background:linear-gradient(60deg, rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1),rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1),rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1),rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1),rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1),rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1),rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,0), rgb(0,0,139,1)); padding:50px 20px; border-radius:100px"> <big><big><big><br><center><b>Rainy Days</b></center></big></big></big> <div style="background:rgb(0,0,139); border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>INTRODUCTION</b></div> Content <div style="background:rgb(0,0,139); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>APPEARANCE</b></big></div> Content <div style="background:rgb(0,0,139); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>PERSONALITY</b></big></div> Content <div style="background:rgb(0,0,139); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>HISTORY</b></big></div> Content <div style="background:rgb(0,0,139); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>RELATIONSHIPS</b></big></div> Content </div></div></div></center>
Content
Content
Content
Content
Content
<!-- cred. Cleverduck09 --> <center><div style="background:linear-gradient(#8aeed5,#63b9db,#4479e1,#2645e0,#0417bf, #03139c); border-radius: 100px"><div style="background:linear-gradient(60deg, rgb(255,255,255,0.20),rgb(255,255,255,0.20), rgb(255,255,255,0), rgb(255,255,255,0.20), rgb(255,255,255,0.20), rgb(255,255,255,0), rgb(255,255,255,0.20),rgb(255,255,255,0.20), rgb(255,255,255,0)); padding: 50px 20px;"><big><big><big><center><b>OCEAN DESIGN</b></center></big></big></big> <div style="background:linear-gradient(to left, #8aeed5,#63b9db,#4479e1,#2645e0); border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>INTRODUCTION</b></div> Content <div style="background:linear-gradient(to left, #8aeed5,#63b9db,#4479e1,#2645e0); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>APPEARANCE</b></big></div> Content <div style="background:linear-gradient(to left, #8aeed5,#63b9db,#4479e1,#2645e0); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>PERSONALITY</b></big></div> Content <div style="background:linear-gradient(to left, #8aeed5,#63b9db,#4479e1,#2645e0); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>HISTORY</b></big></div> Content <div style="background:linear-gradient(to left, #8aeed5,#63b9db,#4479e1,#2645e0); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>RELATIONSHIPS</b></big></div> Content </div></div></center>
Content
Content
Content
Content
Content
<!-- cred. Cleverduck09 --> <center><div style="background:linear-gradient(to bottom, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange, orange,orange, orange, orange, orange, orange,orange, orange, orange, orange, orange, orange, orange,orange, orange, orange, orange, orange, orange, orange, orange, blue, blue, blue, blue, blue, blue, blue,blue, blue, blue, blue, blue, blue, blue, blue, blue, blue,blue, blue, blue, blue, blue, blue, blue, blue,blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue, blue); border-radius: 100px; padding: 50px 50px; color:white"><br><br><br><br><br><br><br><br><br><br><br><div style="background:radial-gradient(rgb(255,211,0,1), rgb(255,211,0,1), rgb(255,211,0,1), rgb(255,211,0,0.5), rgb(255,211,0,0.25), rgb(204,204,0,0));width:120px; height: 120px; border-radius:100px 100px"></div><big><big><big><br><center><b>SETTING SUN DESIGN</b></center></big></big></big> <div style="background:linear-gradient(to left, #8aeed5,#63b9db,#4479e1,#2645e0); border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>INTRODUCTION</b></div> Content <div style="background:linear-gradient(to left, #8aeed5,#63b9db,#4479e1,#2645e0); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>APPEARANCE</b></big></div> Content <div style="background:linear-gradient(to left, #8aeed5,#63b9db,#4479e1,#2645e0); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>PERSONALITY</b></big></div> Content <div style="background:linear-gradient(to left, #8aeed5,#63b9db,#4479e1,#2645e0); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>HISTORY</b></big></div> Content <div style="background:linear-gradient(to left, #8aeed5,#63b9db,#4479e1,#2645e0); border-radius: 40px; padding: 10px 10px; opacity: 50%"><big><b>RELATIONSHIPS</b></big></div> Content </div></center>
Content
Content
Content
Content
Content
<!-- cred. Cleverduck09 --> <div style="background:linear-gradient(white,blue); padding: 50px 50px; border-radius: 20px; border:100px double; border-image:linear-gradient(to top left, white, blue) 1"><big><big><big><b>MODERNBLUE DESIGN</b></big></big></big><br> <div style="background:blue;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>INTRODUCTION</b></div> Content <div style="background:blue;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>APPEARANCE</b></div> Content <div style="background:blue;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>PERSONALITY</b></div> Content <div style="background:blue;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>HISTORY</b></div> Content <div style="background:blue;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>RELATIONSHIPS</b></div> Content </div>
Content
Content
Content
Content
Content
<!-- cred. Cleverduck09 --> <div style="background:linear-gradient(#0B1459,#952FAF); color:white;padding: 20px 50px; border-radius: 100px"><big><big><big><b><center>PURPLE NIGHT DESIGN</center></b></big></big></big><br> <div style="background:#0B1459;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>INTRODUCTION</b></div> Content <div style="background:#0B1459;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>APPEARANCE</b></div> Content <div style="background:#0B1459;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>PERSONALITY</b></div> Content <div style="background:#0B1459;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>HISTORY</b></div> Content <div style="background:#0B1459;border-radius: 40px; padding: 10px 10px; opacity: 50%"><b>RELATIONSHIPS</b></div> Content </div>
Content
Content
Content
Content
Content
<div style="font-family:IM Fell DW Pica"> <div style="position:relative;border-radius:0px;height:500px; max-width:650px; overflow:hidden"> [[File:AestheticDarkCloudGif.gif|link=|800px]] <div style="position:absolute; top:0px; left:0%; width:100%; border-radius:15px; text-align:center;"> <div style="color:black;"> <div style="position:relative;top:20px;left:15px;background:rgba(255, 255, 255, 0.5);border-radius:10px;height:80px;width:610px;color:black;border:3px white double"> <div style="position:relative;top:0px"> <br> <big><big><b>[U S E R N A M E]</b></big></big> </div> </div> <div style="position:relative;top:30px;left:15px;background:rgba(255, 255, 255, 0.5);border-radius:10px;height:200px;width:610px;color:black;border:3px white double"> <div style="position:relative;top:0px"> <br> [CONTENT] </div> </div> <div style="position:relative;top:40px;left:15px;background:rgba(255, 255, 255, 0.5);border-radius:10px;height:100px;width:610px;color:black;border:3px white double"> <div style="position:relative;top:10px"> <br> [info | more info | even more info] </div> </div> <div style="position:relative;top:40px;left:15px;"> [[User:TheObliviousWhale|<font color="black">Coding Credits</font>]] </div> </div> </div> </div> </div>
<div style="overflow:hidden;height:350px"> <div style="overflow:hidden;background:white;height:350px;width:600px;border-radius:15px"></div> <div style="border:3px black solid;height:180px;width:180px;border-radius:100%"> <div style="top:-340px;left:30px;position:relative;overflow:hidden;height:150px;width:150px;border-radius:100%;">[[File:AestheticCity.jpg|center|link=|150px]]</div></div> <div style="font-family:Rubik;font-size:25px;position:relative;top:-470px;left:200px">[username]</div> <div style="font-family:Rubik;font-size:25px;text-align:center;position:relative;top:-510px;left:450px;background:lightblue;font-size:20px;height:20px;padding:10px;width:100px;border-radius:5px;color:white"><div style="position:relative;top:-5px;cursor:pointer">Follow</div></div> <div style="font-family:Rubik"> <div style="position:relative;top:-500px;left:210px"> '''0''' posts </div> <div style="position:relative;top:-527px;left:330px"> '''0''' followers </div> <div style="position:relative;top:-554px;left:440px"> '''0''' following </div> </div> <div style="position:relative;font-family:Rubik;top:-540px;left:210px;width:380px">'''[name]'''<br>[pronouns]<br>[text/bio here]<br><br><span class="plainlinks">https://coding-help.fandom.com/f</span></div> <br><br><span class="plainlinks">https://coding-help.fandom.com/f<br><br><br><small>[[User:TheObliviousWhale|Coding Credits]]</small></span> </div> </div> <center>[[User:TheObliviousWhale|Coding Credits]]</small>
<div style="overflow:hidden;height:670px">
<div style="background:white;height:670px;width:600px;font-family:Rubik">
<br>
<br>
<br>
<div style="text-align:center;font-family:Rubik;position:relative;bottom:20px;font-size:20px">'''HEADING/USERNAME'''</div>
<div style="position:relative;left:540px;top:-60px;font-size:20px">
⚙️</div>
<div style="border-bottom:lightgrey solid 1px;position:relative;top:-30px"></div>
{| align="center" width="70%" style="text-align:center; vertical-align:center; position:relative;left:80px;top:-20px"
| style="width:10%;"| <big><big><big>'''0'''</big></big></big><br><div style="position:relative;top:-10px;color:lightgrey">posts</div>
| style="width:10%" | <big><big><big>'''0'''</big></big></big><br><div style="position:relative;top:-10px;color:lightgrey">followers</div>
| style="width:10%" | <big><big><big>'''0'''</big></big></big><br><div style="position:relative;top:-10px;color:lightgrey">following</div>
|}
<div style="position:relative;top:-70px;height:100px;width:100px;overflow:hidden;border-radius:100%;left:20px">
[[File:Aesthetic-Dark-Clouds.jpg|center|link=|100px]]
</div>
{| align="center" width="70%" style="text-align:center; vertical-align:center; position:relative;left:70px;top:-130px"
| <div style="border:black 1px solid;border-radius:5px;height:0px;width:150px;padding:20px;text-align:center;"><div style="position:relative;top:-10px"><!--you can link your MW here-->
<font color="grey">Contact</font></div></div>
| <div style="background:lightgrey;border-radius:5px;height:0px;width:150px;padding:20px;text-align:center;"><div style="position:relative;top:-10px"><span class="plainlinks">
<!--you can put your edit link here--><font color="black">Edit Profile</font></span></div></div>
|}
<div style="position:relative;left:20px;top:-90px;width:550px">
'''NAME/HEADING'''
<div style="color:lightgrey">@USERNAME</div>
[text/bio/etc.]
<span class="plainlinks">https://coding-help.fandom.com/f</span>
</div>
{| align="center" width="60%" style="text-align:center; vertical-align:left; position:relative;left:0px;top:-70px"
| <div style="font-size:20px">'''Posts'''</div>
| <div style="color:rgba(0,0,0,0.2);font-size:20px">|</div>
| <div style="font-size:20px">Contribs</div>
| <div style="color:rgba(0,0,0,0.2);font-size:20px">|</div>
| <div style="font-size:20px">Blog</div>
|}
</div>
{| align="left" width="0%" style="text-align:left; vertical-align:left; position:relative;left:-10px;top:-180px"
| <div style="postion:relative;left:-30px;height:177px;width:200px;overflow:hidden;">[[File:Indigo.jpg|link=|200px]]</div>
| <div style="postion:relative;left:-0px;height:177px;width:200px;overflow:hidden;">[[File:Hihihi.jpg|link=|200px]]</div>
| <div style="postion:relative;left:-0px;height:177px;width:200px;overflow:hidden;">[[File:Flowerssssss.jpg|link=|200px]]</div>
|}
</div>
<div style="text-align:center;font-size:10px;width:600px;font-family:Josefin Sans">[[User:TheObliviousWhale|✦Coding Credits✦]]</div></div>
<div style="border:black 8px solid; width:auto; height:auto; overflow:auto; border-image:linear-gradient(to top left, red, blue) 1; padding:5px; margin:10px;"> <div style="background:linear-gradient(to right, red, orange, yellow, green, blue, purple); border:solid black 2px; color:#e62e00; padding:20px; margin:20px; border-radius:10px; font-family:comic sans ms;"> <center><p> <b><font size="6">Title here</font></b> </p></center> <div style="background:blue; border:solid black 2px; margin:10px; padding:5px; border-radius:10px; color:orange; font-family:courier;"> <center> <p> <b><font size="4">Subtitle here</font></b> </p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Velit euismod in pellentesque massa placerat duis. A scelerisque purus semper eget duis. Interdum varius sit amet mattis vulputate. Nunc vel risus commodo viverra maecenas accumsan lacus vel facilisis. Dignissim diam quis enim lobortis scelerisque fermentum dui faucibus. Non arcu risus quis varius quam. Convallis convallis tellus id interdum velit laoreet id donec ultrices.</p> </center> </div> <div style="background-color:tomato; border:solid black 1px; border-radius:5px; font-family:arial;"> <center> <font size="2"; font color="black"> Coding by [[User:KiwiReg|<span style="color:blue; font-size:15px;">Regina</span>]] </font> </center> </div> </div> </div>
Title here
Subtitle here
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Velit euismod in pellentesque massa placerat duis. A scelerisque purus semper eget duis. Interdum varius sit amet mattis vulputate. Nunc vel risus commodo viverra maecenas accumsan lacus vel facilisis. Dignissim diam quis enim lobortis scelerisque fermentum dui faucibus. Non arcu risus quis varius quam. Convallis convallis tellus id interdum velit laoreet id donec ultrices.
Coding by Regina
<div style="background:linear-gradient(to bottom right, hotpink, pink); border:solid black 2px; border-radius:15px; box-shadow:0 4px 8px 0 pink, 0 6px 20px 0 pink; margin:20px;"> <center> <h1 style="text-shadow:2px 2px 2px deeppink;">Lorem Ipsum/Title</h1> <p style="font-size:16px; padding:15px; text-shadow:2px 2px 2px pink;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nulla pharetra diam sit amet nisl suscipit adipiscing bibendum est. Tortor posuere ac ut consequat semper viverra nam libero. Tempor id eu nisl nunc mi ipsum faucibus. Arcu felis bibendum ut tristique et egestas quis ipsum suspendisse. Faucibus vitae aliquet nec ullamcorper sit amet risus. Facilisis volutpat est velit egestas dui. Faucibus interdum posuere lorem ipsum dolor sit amet consectetur adipiscing. Fermentum dui faucibus in ornare quam viverra orci sagittis eu. Adipiscing elit pellentesque habitant morbi.</p> <small>[[User:KiwiReg|<span style="color:teal;">Coding Credits</span>]]</small> </center> </div>
Lorem Ipsum/Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nulla pharetra diam sit amet nisl suscipit adipiscing bibendum est. Tortor posuere ac ut consequat semper viverra nam libero. Tempor id eu nisl nunc mi ipsum faucibus. Arcu felis bibendum ut tristique et egestas quis ipsum suspendisse. Faucibus vitae aliquet nec ullamcorper sit amet risus. Facilisis volutpat est velit egestas dui. Faucibus interdum posuere lorem ipsum dolor sit amet consectetur adipiscing. Fermentum dui faucibus in ornare quam viverra orci sagittis eu. Adipiscing elit pellentesque habitant morbi.
Click on [Expand] if a/some collapsible(s) doesn't work.
Note that I've coded the first few designs on Oasis, so it may look different on Fandom Desktop.
Pink Theme
|
Pink Code
|
Planner Style Bio
|
Planner Style Code
|
Heroes on Fire!
|
Heroes Code
|
Wacom Style
|
Wacom Code
|
T-Chart
|
T-Chart Code
|
Notebook Design
|
Notebook Code
|
Binder Design
|
Binder's Code
|
Chess Design
|
Chess Code
|
Table of Content Design
|
Table of Contents Code
|
Lucidious Design
|
Lucidious Code
|
References
|
Lorem Ipsum/Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nulla pharetra diam sit amet nisl suscipit adipiscing bibendum est. Tortor posuere ac ut consequat semper viverra nam libero. Tempor id eu nisl nunc mi ipsum faucibus. Arcu felis bibendum ut tristique et egestas quis ipsum suspendisse. Faucibus vitae aliquet nec ullamcorper sit amet risus. Facilisis volutpat est velit egestas dui. Faucibus interdum posuere lorem ipsum dolor sit amet consectetur adipiscing. Fermentum dui faucibus in ornare quam viverra orci sagittis eu. Adipiscing elit pellentesque habitant morbi.
<div style="width:auto; height:auto; overflow:auto; background-color:white; padding:5px;">
<center><h1 style="font-family: comfortaa;">USERNAME/NICKNAME</h1><small>[[User:KiwiReg|Coded by KiwiReg]]</small></center>
----
<pre style="float:left; font-weight:bold;">Bio</pre>
<pre style="float:right; font-weight:bold;">Fanfiction/Fanart</pre>
<br/><br/>
<span style="float:right; text-align:center; width:320px; height:450px; padding:10px; border:solid black 2px; margin-left:2px; margin-top:7px; overflow:auto;">
Lorem ipsum dolor sit amet,
consectetur adipiscing elit,
sed do eiusmod tempor incididunt
Imperdiet nulla malesuada pellent
Consectetur a erat nam at lectus.
Habitant morbi tristique senectus
Eget nulla facilisi etiam dignissim
Adipiscing enim eu turpis egestas
Eu nisl nunc mi ipsum faucibus vitae
Sit amet est placerat in egestas
Venenatis tellus in metus vulputate.
Duis ultricies lacus sed turpis
Amet justo donec enim diam vulputate
Vulputate enim nulla aliquet porttitor.
Convallis tellus id interdum velit
laoreet id donec. Mauris commodo quis
imperdiet massa tincidunt nunc pulvinar
sapien et. Volutpat sed cras ornare arcu.
At quis risus sed vulputate odio ut.
Enim nulla aliquet porttitor lacus
luctus accumsan. Non blandit massa enim
nec dui nunc. Adipiscing elit
pellentesque habitant morbi tristique
senectus. Et molestie ac feugiat sed
lectus vestibulum. Enim nunc faucibus
a pellentesque sit. Urna porttitor
rhoncus dolor purus non. Vel pharetra
vel turpis nunc eget lorem dolor.
Non curabitur gravida arcu ac tortor
dignissim convallis. Condimentum
lacinia quis vel eros donec ac odio.
A pellentesque sit amet porttitor eget.
Augue interdum velit euismod in
pellentesque massa placerat duis
ultricies. Feugiat scelerisque varius
morbi enim nunc faucibus a pellentesque sit.
Augue mauris augue neque gravida.
</span>
<div style="border:solid black 2px; float:left; width:320px; height:450px; padding:10px; margin-right:2px;">
<span>Intro</span>
<p style="color:grey;">Content</p>
<br/> <!--If you are going to put several sentences, it's best to delete this break! Because it will push out if you don't!--> <!--The break here is just a placeholder!-->
----
<span>Hobbies</span>
<p style="color:grey;">Content</p>
<br/> <!--If you are going to put several sentences, it's best to delete this break!-->
----
<span>Contact Info</span>
<p style="color:grey;">Content</p>
<br/> <!--If you are going to put several sentences, it's best to delete this break!-->
----
<span>Others</span>
<p style="color:grey;">Final comments</p>
<br/>
</div>
</div>
Heroes on Fire!
When the night is dark,
And the outside so cold.
*Heroes on fire!*
I'm a child I knew,
About a world so true.
*She pulled down the stars!*
I needed a hero,
If I only knew that the hero was me.
*The hero was you, was you*
Coding by Regina
<center>
<div style="background-color:purple; border:solid black 2px; border-radius:10px; overflow:auto; font-family:arial; padding:10px; margin:10px;">
<div style="padding-bottom:10px;color:orange; padding:10px; margin:10px;">
<strong><h1>Heroes on Fire!</h1></strong>
</div>
<div style="color:white; padding:10px; margin:10px;">
<h2>When the night is dark,<br/>And the outside so cold.<br/>*Heroes on fire!*<br/>I'm a child I knew,<br/>About a world so true.<br/>*She pulled down the stars!*<br/>I needed a hero,<br/>If I only knew that the hero was me.<br/>*The hero was you, was you*</h2>
</div>
<div style="color:yellow; padding:10px; margin:10px;">
<small>Coding by [[User:KiwiReg|<span style="color:white; font-size:14px;">Regina</span>]]</small>
</div>
</div>
</center>
<div style="background:linear-gradient(#00ffd6, #00a9d6); position:absolute; width:600px; height:400px; border:outset black 1.5px; border-radius:5%; padding-bottom:10px;"> <center><span style="color:teal; padding:0px; margin:0px; font-family:Indie Flower; font-size:44px; font-weight:bold;">Wacom</span></center> <div style="background-color:black; position:relative; width:80%; height:80%; margin:6%; margin-top:0px; margin-left:50px; border:double black 2px; border-radius:30px;"> <div> <div style="background-color:rgba(255, 255, 255, 0.6); border:solid white 2px; width:125px; height:150px; color:white; margin:10px; border-radius:10%; text-align:center; float:left;">Text here!</div> <div style="background-color:rgba(255, 255, 255, 0.6); border:solid white 2px; width:125px; height:150px; color:white; margin:10px; border-radius:10%; text-align:center; float:right;">Text here!</div> <div style="background-color:rgba(255, 255, 255, 0.6); border:solid white 2px; width:150px; height:200px; color:white; margin-left:165px; border-radius:10%; text-align:center; align:center;">Text here!</div> </div> <div> <span style="float:left; color:white; font-size:36px; margin-left:10px;">ㅠ</span> <span style="float:right; color:white; font-size:36px; margin-right:10px;">ㅠ</span><br/><br/> <div style="text-align:center; color:pink; font-size:36px;">ω</div> </div> <div style="text-align:center; font-size:small;">[[User:KiwiReg|<span style="color:teal; padding:5px; font-family:indie flower;">Coding Credits</span>]]</div> </div> </div>
<center><div style="border-bottom: 1px gray solid; width: 400px; height: 100px; background:radial-gradient(circle, lightgrey, gray); border-radius: 30px 30px 0px 0px; font-size: 20px; text-decoration: underline; text-decoration-style: wavy;">KotLC Pros and Cons</div></center> <div style="border-right: 1px gray solid; width: 200px; height: 450px; background:radial-gradient(circle, lavenderblush, lightpink); float: left; margin-left: 228px; border-radius: 0px 0px 0px 10%;">'''PROS'''<br/>-Point one<br/>-Point two<br/>-Point three<br/>-Point four<br/></div> <div style="border-left: 1px gray solid; width: 200px; height: 450px; background:radial-gradient(circle, lavender, #c7c7ff); float: right; margin-right: 228px; border-radius: 0px 0px 10% 0px;">'''CONS'''<br/>-Point one<br/>-Point two<br/>-Point three<br/>-Point four<br/></div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Mauris sit amet massa vitae tortor. Id donec ultrices tincidunt arcu non sodales. Amet consectetur adipiscing elit duis tristique. Magna eget est lorem ipsum dolor. Nam at lectus urna duis convallis convallis tellus id. Quis ipsum suspendisse ultrices gravida dictum fusce ut placerat orci. Morbi tristique senectus et netus et malesuada fames. Lacus vestibulum sed arcu non odio euismod lacinia. Condimentum lacinia quis vel eros donec ac. Eget nunc lobortis mattis aliquam faucibus purus in. Iaculis urna id volutpat lacus laoreet. Sed nisi lacus sed viverra tellus in hac habitasse platea. Justo laoreet sit amet cursus sit amet dictum sit amet.
Tristique senectus et netus et. Diam quam nulla porttitor massa id neque aliquam vestibulum morbi. Elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Scelerisque mauris pellentesque pulvinar pellentesque habitant morbi. Euismod elementum nisi quis eleifend quam. Scelerisque fermentum dui faucibus in ornare quam viverra. Mauris commodo quis imperdiet massa tincidunt nunc. Duis ultricies lacus sed turpis tincidunt id aliquet risus feugiat. Tristique sollicitudin nibh sit amet. Ornare arcu dui vivamus arcu felis bibendum. Id semper risus in hendrerit gravida rutrum quisque non tellus.
Vestibulum sed arcu non odio. Volutpat ac tincidunt vitae semper quis lectus. Egestas diam in arcu cursus euismod quis viverra nibh cras. Rutrum tellus pellentesque eu tincidunt tortor. Aliquam purus sit amet luctus venenatis lectus magna. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Sed arcu non odio euismod lacinia at. Et odio pellentesque diam volutpat commodo sed egestas. Duis at consectetur lorem donec massa sapien. Tortor id aliquet lectus proin nibh nisl condimentum id venenatis. Risus nullam eget felis eget nunc. Commodo ullamcorper a lacus vestibulum sed arcu non. Porttitor eget dolor morbi non arcu.
Leo urna molestie at elementum eu facilisis. Sed augue lacus viverra vitae congue eu consequat ac. Nibh sit amet commodo nulla facilisi nullam vehicula ipsum a. Ut diam quam nulla porttitor massa id. Nibh praesent tristique magna sit amet. Tristique risus nec feugiat in fermentum. Aliquet risus feugiat in ante metus. Mus mauris vitae ultricies leo. Vestibulum sed arcu non odio euismod lacinia at quis. Consequat mauris nunc congue nisi vitae suscipit tellus mauris. Penatibus et magnis dis parturient montes nascetur. Turpis tincidunt id aliquet risus feugiat in ante metus dictum. Nunc eget lorem dolor sed. Risus ultricies tristique nulla aliquet enim tortor at. Suspendisse potenti nullam ac tortor vitae purus.
In ante metus dictum at. Sit amet est placerat in egestas erat imperdiet. Mollis nunc sed id semper risus. Aliquet porttitor lacus luctus accumsan tortor posuere ac. Ac odio tempor orci dapibus ultrices in. A condimentum vitae sapien pellentesque habitant morbi. Parturient montes nascetur ridiculus mus. Adipiscing tristique risus nec feugiat in fermentum. Volutpat ac tincidunt vitae semper quis lectus nulla. Arcu felis bibendum ut tristique. At urna condimentum mattis pellentesque id. Sed faucibus turpis in eu. At elementum eu facilisis sed odio morbi quis commodo. Dolor morbi non arcu risus quis varius quam.
Credits
<div style="background-color: #fff; background-image: linear-gradient(90deg, transparent 79px, #abced4 79px, #abced4 81px, transparent 81px), linear-gradient(#eee .1em, transparent .1em); background-size: 100% 1.5em; padding-left: 150px; padding-top:20px; padding-bottom:50px;">
<div style="color:gray; font-weight:bold; font-size:34px; text-align:center; padding:0px; margin:0px;">KotLC Essay</div>
<span style="color:gray; font-size:16px;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Mauris sit amet massa vitae tortor. Id donec ultrices tincidunt arcu non sodales. Amet consectetur adipiscing elit duis tristique. Magna eget est lorem ipsum dolor. Nam at lectus urna duis convallis convallis tellus id. Quis ipsum suspendisse ultrices gravida dictum fusce ut placerat orci. Morbi tristique senectus et netus et malesuada fames. Lacus vestibulum sed arcu non odio euismod lacinia. Condimentum lacinia quis vel eros donec ac. Eget nunc lobortis mattis aliquam faucibus purus in. Iaculis urna id volutpat lacus laoreet. Sed nisi lacus sed viverra tellus in hac habitasse platea. Justo laoreet sit amet cursus sit amet dictum sit amet.<br/><br/>
Tristique senectus et netus et. Diam quam nulla porttitor massa id neque aliquam vestibulum morbi. Elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Scelerisque mauris pellentesque pulvinar pellentesque habitant morbi. Euismod elementum nisi quis eleifend quam. Scelerisque fermentum dui faucibus in ornare quam viverra. Mauris commodo quis imperdiet massa tincidunt nunc. Duis ultricies lacus sed turpis tincidunt id aliquet risus feugiat. Tristique sollicitudin nibh sit amet. Ornare arcu dui vivamus arcu felis bibendum. Id semper risus in hendrerit gravida rutrum quisque non tellus.<br/><br/>
Vestibulum sed arcu non odio. Volutpat ac tincidunt vitae semper quis lectus. Egestas diam in arcu cursus euismod quis viverra nibh cras. Rutrum tellus pellentesque eu tincidunt tortor. Aliquam purus sit amet luctus venenatis lectus magna. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Sed arcu non odio euismod lacinia at. Et odio pellentesque diam volutpat commodo sed egestas. Duis at consectetur lorem donec massa sapien. Tortor id aliquet lectus proin nibh nisl condimentum id venenatis. Risus nullam eget felis eget nunc. Commodo ullamcorper a lacus vestibulum sed arcu non. Porttitor eget dolor morbi non arcu.<br/><br/>
Leo urna molestie at elementum eu facilisis. Sed augue lacus viverra vitae congue eu consequat ac. Nibh sit amet commodo nulla facilisi nullam vehicula ipsum a. Ut diam quam nulla porttitor massa id. Nibh praesent tristique magna sit amet. Tristique risus nec feugiat in fermentum. Aliquet risus feugiat in ante metus. Mus mauris vitae ultricies leo. Vestibulum sed arcu non odio euismod lacinia at quis. Consequat mauris nunc congue nisi vitae suscipit tellus mauris. Penatibus et magnis dis parturient montes nascetur. Turpis tincidunt id aliquet risus feugiat in ante metus dictum. Nunc eget lorem dolor sed. Risus ultricies tristique nulla aliquet enim tortor at. Suspendisse potenti nullam ac tortor vitae purus.<br/><br/>
In ante metus dictum at. Sit amet est placerat in egestas erat imperdiet. Mollis nunc sed id semper risus. Aliquet porttitor lacus luctus accumsan tortor posuere ac. Ac odio tempor orci dapibus ultrices in. A condimentum vitae sapien pellentesque habitant morbi. Parturient montes nascetur ridiculus mus. Adipiscing tristique risus nec feugiat in fermentum. Volutpat ac tincidunt vitae semper quis lectus nulla. Arcu felis bibendum ut tristique. At urna condimentum mattis pellentesque id. Sed faucibus turpis in eu. At elementum eu facilisis sed odio morbi quis commodo. Dolor morbi non arcu risus quis varius quam.
</span>
</div>
Title here
Subtitle here
Contents here:
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Cum sociis natoque penatibus et magnis dis. Elit at imperdiet dui accumsan sit. Massa eget egestas purus viverra accumsan in. Luctus venenatis lectus magna fringilla urna porttitor rhoncus dolor. Est ultricies integer quis auctor elit sed vulputate mi sit. Vulputate sapien nec sagittis aliquam malesuada bibendum. Porttitor rhoncus dolor purus non enim praesent. Pellentesque diam volutpat commodo sed egestas egestas fringilla phasellus. Fermentum leo vel orci porta non pulvinar neque laoreet suspendisse. Id aliquet risus feugiat in ante. Netus et malesuada fames ac. Adipiscing enim eu turpis egestas pretium aenean pharetra magna ac. Egestas dui id ornare arcu odio ut sem nulla. Pulvinar etiam non quam lacus suspendisse faucibus interdum posuere lorem. Faucibus vitae aliquet nec ullamcorper sit amet risus nullam eget. Ut placerat orci nulla pellentesque dignissim enim sit amet. Convallis a cras semper auctor neque. Aliquam vestibulum morbi blandit cursus risus.
<div style="background-color:hsl(2, 57%, 40%); background-image:repeating-linear-gradient(transparent, transparent 50px, rgba(0, 0, 0, .4) 50px, rgba(0,0,0,.4) 53px, transparent 53px, transparent 63px, rgba(0,0,0,.4) 63px, rgba(0,0,0,.4) 66px, transparent 66px, transparent 116px, rgba(0, 0, 0, .5) 116px, rgba(0, 0, 0, .5) 166px, rgba(255, 255, 255, .2) 166px, rgba(255, 255, 255, .2) 169px, rgba(0, 0, 0, .5) 169px, rgba(0, 0, 0, .5) 179px, rgba(255, 255, 255, .2) 179px, rgba(255, 255, 255, .2) 182px, rgba(0, 0, 0, .5) 182px, rgba(0, 0, 0, .5) 232px, transparent 232px), repeating-linear-gradient(270deg, transparent, transparent 50px, rgba(0, 0, 0, .4) 50px, rgba(0, 0, 0, .4) 53px, transparent 53px, transparent 63px, rgba(0, 0, 0, .4) 63px, rgba(0, 0, 0, .4) 66px, transparent 66px, transparent 116px, rgba(0, 0, 0, .5) 116px, rgba(0, 0, 0, .5) 166px, rgba(255, 255, 255, .2) 166px, rgba(255, 255, 255, .2) 169px, rgba(0, 0, 0, .5) 169px, rgba(0, 0, 0, .5) 179px, rgba(255, 255, 255, .2) 179px, rgba(255, 255, 255, .2) 182px, rgba(0, 0, 0, .5) 182px, rgba(0, 0, 0, .5) 232px, transparent 232px), repeating-linear-gradient(125deg, transparent, transparent 2px, rgba(0, 0, 0, .2) 2px, rgba(0, 0, 0, .2) 3px, transparent 3px, transparent 5px, rgba(0, 0, 0, .2) 5px); border-radius:50%; width:500px; height:600px; text-align:center; color:white; padding:10px; border:double 5px white;">
<h1 style="font-weight:bold;">Title here</h1>
<h4>Subtitle here</h4>
<center>
<div style="overflow:auto; background-color:rgba(255, 255, 255, 0.5); width:300px; height:400px; margin-top:20px; border-radius:20px; border:1px white ridge;">
<p>
'''Contents here:'''<br/>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Cum sociis natoque penatibus et magnis dis. Elit at imperdiet dui accumsan sit. Massa eget egestas purus viverra accumsan in. Luctus venenatis lectus magna fringilla urna porttitor rhoncus dolor. Est ultricies integer quis auctor elit sed vulputate mi sit. Vulputate sapien nec sagittis aliquam malesuada bibendum. Porttitor rhoncus dolor purus non enim praesent. Pellentesque diam volutpat commodo sed egestas egestas fringilla phasellus. Fermentum leo vel orci porta non pulvinar neque laoreet suspendisse. Id aliquet risus feugiat in ante. Netus et malesuada fames ac. Adipiscing enim eu turpis egestas pretium aenean pharetra magna ac. Egestas dui id ornare arcu odio ut sem nulla. Pulvinar etiam non quam lacus suspendisse faucibus interdum posuere lorem. Faucibus vitae aliquet nec ullamcorper sit amet risus nullam eget. Ut placerat orci nulla pellentesque dignissim enim sit amet. Convallis a cras semper auctor neque. Aliquam vestibulum morbi blandit cursus risus.
</p>
</div>
</center>
<span>[[User:KiwiReg|<span style="color:lightcoral; text-shadow:1px 1px 1px maroon;">Coding Credits</span>]]</span>
</div>
♞ Title Here ♞
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Arcu cursus euismod quis viverra nibh cras pulvinar mattis. Tellus elementum sagittis vitae et leo duis ut diam. Etiam non quam lacus suspendisse faucibus interdum posuere lorem. Sed ullamcorper morbi tincidunt ornare massa eget egestas purus. In fermentum posuere urna nec. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Eget nunc scelerisque viverra mauris in aliquam sem. Phasellus faucibus scelerisque eleifend donec pretium vulputate. Lobortis elementum nibh tellus molestie nunc non blandit massa enim. Id eu nisl nunc mi ipsum faucibus vitae. Ac auctor augue mauris augue neque gravida in. Purus gravida quis blandit turpis cursus. Accumsan tortor posuere ac ut. Nulla aliquet porttitor lacus luctus accumsan tortor. Elit scelerisque mauris pellentesque pulvinar pellentesque.
To be Added
Feel free to change the colors and fonts, just be sure to credit me!
Table of Contents
lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem
lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem
To be added
Feel free to change the border radius and add a header if you want.
Coded by Regina
To be added
Thanks to BlueRaptor 01 for fixing my collapsible!
Also credit to CSS Patterns Gallery for some of the design backgrounds.
Mini Profile
|
Mini Profile Result
|
<div class="mw-collapsible mw-collapsed" id="mw-customcollapsible-TestTwoGlitch" style="padding: 20px; overflow: auto; font-weight:normal;"> <div style="Border:3px transparent solid;Border-Radius:10px 10px;background:white"> <center>Write about yourself!</center> <b><div style="overflow: hidden; width: 205px; height: 201px; border-radius:90px;box-shadow: grey 17px 17px 18px;">[[File:EfxiBl6UcAAxCMF.jpg|203x203px]] </div>
Design 1 Code
|
Result
|
Design 2 Code
|
Result
|
Design 3 Code
|
Result
|
References
|
<div style="background:linear-gradient(180deg,#cc9932,white);"> <div style="border:8px double #7a5b1e;border-radius:1em;text-align:center;box-shadow:inset 0px 0px 10px white;color:white;"> Text here. <span style="font-size:30px;text-shadow: 0px 0px 10px white;">'''Text/Heading'''</span> •List •List •List <span style="font-size:30px;text-shadow: 0px 0px 10px white;">'''Text/Heading'''</span> Text here. <span style="font-size:30px;text-shadow: 0px 0px 10px white;">'''Text/Heading'''</span> •List •List <span style="font-size:30px;text-shadow: 0px 0px 10px white;">'''Text/Heading'''</span> •List •List •List <span style="font-size:30px;text-shadow: 0px 0px 10px white;">'''Text/Heading'''</span> <span style="font-size:30px;text-shadow: 0px 0px 10px white;">'''Text/Heading'''</span> [[Special:Mypage<!--what you want it to link to-->|<span style="color:#8e6a22;text-shadow:0px 0px 5px white;">Link text</span>]] <!--Use that for links, just copy and paste the code and change the text--> <div style="text-align:right;font-size:20px;color:rgba(0,0,0,0.5);">''Coding by [[User:Willowlight7|<span style="color:rgba(0,0,0,0.5);">Willowlight7</span>]]''</div></div></div> <!--CODING DESIGN by WILLOWPAW. YOU ARE FREE TO USE THIS DESIGN, BUT DO NOT REMOVE THIS CREDIT.--> </div>
Text here.
Text/Heading
•List
•List
•List
Text/Heading
Text here.
Text/Heading
•List
•List
Text/Heading
•List
•List
•List
Text/Heading
Text/Heading
<!--delete the spaces inbetween }}s --> <center> <div style="border-radius:0.5em;background-image: -webkit-linear-gradient(top left, grey 0%, #222222 50%, grey 100%);border:none;text-shadow: 2px 2px 2px black;"> <div style="border-radius:0.5em;color:white;background-image: -webkit-linear-gradient(top left, #222222 0%, grey 50%, #222222 100%);border:none;box-shadow: 0 2px 6px #000000;">-TITLE- <div style="background:rgba(0, 0, 0, 0.5);color:#dddddd;border-radius:0.5em;border:none;">[[Special:MyPage<!--what you want to link to-->|<span style="color:white;">Link Title</span>]]</div>yey</div> <div style="border-radius:0.5em;color:white;background-image: -webkit-linear-gradient(top left, #222222 0%, grey 50%, #222222 100%);border:none;box-shadow: 0 2px 6px #000000;">''Text Goes Here'' <div style="background:rgba(0, 0, 0, 0.5);color:#dddddd;border-radius:0.5em;border:none;">Text Goes Here</div>Text Goes Here</div> <div style="border-radius:0.5em;color:white;background-image: -webkit-linear-gradient(top left, #222222 0%, grey 50%, #222222 100%);border:none;box-shadow: 0 2px 6px #000000;">''Text Goes Here'' <div style="background:rgba(0, 0, 0, 0.5);color:#dddddd;border-radius:0.5em;border:none;">Text Goes Here</div>Text Goes Here</div> <div style="text-align:right;font-size:14px;color:rgba(255,255,255,0.5);text-shadow:none;">''Coding by [[User:Willowlight7|<span style="color:rgba(255,255,255,0.5);">Willowlight7</span>]]''</div></center>
<div style="overflow:hidden; margin: 0 auto; border-radius: 20px; width:600px;"> [[File:Raindrops-plants-smell.jpg.653x0_q80_crop-smart.jpg|600px|center]] </div> <div style="background:rgba(255, 255, 255,.6); padding:5px; overflow:hidden; text-align:center; color:white; margin:-50% auto 90% auto; border-radius:19px; width:500px; height:370px; overflow-x: hidden; overflow-y: scroll; box-shadow: 0 0 28px rgba(255,255,255,.9); position: relative;font-family:angelic serif;text-shadow:0 0 3px navy"> <center> <span style="font-family:angelic peace;font-size:55px;color:white;text-shadow:0 2px 6px navy;">YouR NamE</span> Hello. This is content, and content, and content. 'Tis very contentious. You put your introramble here. <span style="font-family:angelic peace;font-size:30px;color:white;text-shadow:0 2px 6px navy;">HeadinG</span> This is even more content. You can put anything here! Your friends, where to find you, links to stuff, etc. <span style="font-family:angelic peace;font-size:30px;color:white;text-shadow:0 2px 6px navy;">HeadinG</span> This is even more content. You can put anything here! Your friends, where to find you, links to stuff, etc. <span style="font-family:angelic peace;font-size:30px;color:white;text-shadow:0 2px 6px navy;">HeadinG</span> This is even more content. You can put anything here! Your friends, where to find you, links to stuff, etc. If you want to add more content, just look in Classic Editor's source mode. There'll be a comment there with the code you need. <span style="font-family:angelic peace;font-size:30px;color:white;text-shadow:0 2px 6px navy;">HeadinG</span> This is even more content. You can put anything here! Your friends, where to find you, RP characters, links to stuff, etc.--> </center><div style="text-align:right;font-size:14px;color:rgba(255,255,255,0.5);text-shadow:none;">''Coding by [[User:Willowlight7|Willowlight7]]</div></div></div> </div>
Bubblegum Pink Code
|
Bubblegum Pink Result
|
Underwater City Code
|
Underwater City Result
|
References
|
__NOTOC__<div style="color:white;background:radial-gradient(hotpink 80%,#000000 50%) 0 2px;background-size:70px 80px;border:5px outset white; box-shadow:0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);border-radius:20px;"> <div style="background:radial-gradient(hotpink 30%,#000000 60%) 0 2px;background-size:70px 80px;border:5px outset white; box-shadow:0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);border-radius:20px;margin:10px;"> <div style="background:radial-gradient(hotpink 90%,#000000 70%) 0 2px;background-size:70px 80px;border:5px outset white; box-shadow:0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);border-radius:20px;margin:5px;"> ==Heading== [text] </div> <div style="background:radial-gradient(hotpink 90%,#000000 70%) 0 2px;background-size:70px 80px;border:5px outset white; box-shadow:0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);border-radius:20px;margin:5px;"> ==Heading== [text] </div> <div style="background:radial-gradient(hotpink 90%,#000000 70%) 0 2px;background-size:70px 80px;border:5px outset white; box-shadow:0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);border-radius:20px;margin:5px;"> ==Heading== [text] </div>
Heading
[text]
Heading
[text]
Heading
[text]
<div style="background:radial-gradient(rgba(10,20,147, 0.3) 23px, #000, transparent -35px), radial-gradient(rgba(0,2,255, 0.3) 23px, #000, transparent 25px) 0 25px, radial-gradient(rgba(0,0,0, 0.3) 23px, #000, transparent 25px) 25px 0, radial-gradient(rgba(0, 0, 0, 0.5) 23px, #000, transparent 25px) 25px 25px, #FFF; background-size:50px 50px; border:5px solid black;box-shadow: 0 2px 15px 2px hotpink, inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 1px rgba(255,255,255,0.3);border-radius:30px;color:#fff;font-family:papyrus;"> <div style="background:rgba(0,0,255,0.4);border:4px solid white;box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);border-radius:20px;margin:5px;"> <div style="background:linear-gradient(150deg, rgba(13, 24, 255, .8), rgba(0, 234, 239, .8), rgba(0, 0, 138, .8)); border: 3px solid black; border-radius:100px; padding:10px;box-shadow:0 2px 6px rgba(0,0,255,0.5), inset 0 1px rgba(60,70,240,0.3), inset 0 10px rgba(200,200,255,,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(255,255,255,0.3);margin:10px;color:black;"> '''Appearance''' </div> <div style="background:linear-gradient(150deg, rgba(13, 24, 255, .8), rgba(0, 234, 239, .8), rgba(0, 0, 138, .8)); border: 3px solid black; border-radius:100px; padding:10px;box-shadow:0 2px 6px rgba(0,0,255,0.5), inset 0 1px rgba(60,70,240,0.3), inset 0 10px rgba(200,200,255,,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(255,255,255,0.3);margin:10px;color:black;"> '''Personality''' </div> <div style="background:linear-gradient(150deg, rgba(13, 24, 255, .8), rgba(0, 234, 239, .8), rgba(0, 0, 138, .8)); border: 3px solid black; border-radius:100px; padding:10px;box-shadow:0 2px 6px rgba(0,0,255,0.5), inset 0 1px rgba(60,70,240,0.3), inset 0 10px rgba(200,200,255,,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(255,255,255,0.3);margin:10px;color:black;"> '''Family''' </div> <div style="background:linear-gradient(150deg, rgba(13, 24, 255, .8), rgba(0, 234, 239, .8), rgba(0, 0, 138, .8)); border: 3px solid black; border-radius:100px; padding:10px;box-shadow:0 2px 6px rgba(0,0,255,0.5), inset 0 1px rgba(60,70,240,0.3), inset 0 10px rgba(200,200,255,,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(255,255,255,0.3);margin:10px;color:black;"> '''Friends''' </div> <div style="background:linear-gradient(150deg, rgba(13, 24, 255, .8), rgba(0, 234, 239, .8), rgba(0, 0, 138, .8)); border: 3px solid black; border-radius:100px; padding:10px;box-shadow:0 2px 6px rgba(0,0,255,0.5), inset 0 1px rgba(60,70,240,0.3), inset 0 10px rgba(200,200,255,,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(255,255,255,0.3);margin:10px;color:black;"> '''History''' </div> <div style="background:linear-gradient(150deg, rgba(13, 24, 255, .8), rgba(0, 234, 239, .8), rgba(0, 0, 138, .8)); border: 3px solid black; border-radius:100px; padding:10px;box-shadow:0 2px 6px rgba(0,0,255,0.5), inset 0 1px rgba(60,70,240,0.3), inset 0 10px rgba(200,200,255,,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(255,255,255,0.3);margin:10px;color:black;"> '''Trivia''' </div> <div style="background:linear-gradient(150deg, rgba(13, 24, 255, .8), rgba(0, 234, 239, .8), rgba(0, 0, 138, .8)); border: 3px solid black; border-radius:100px; padding:10px;box-shadow:0 2px 6px rgba(0,0,255,0.5), inset 0 1px rgba(60,70,240,0.3), inset 0 10px rgba(200,200,255,,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(255,255,255,0.3);margin:10px;color:black;"> '''Gallery''' </div></div>
Appearance
Personality
Family
Friends
History
Trivia
Gallery
Code
|
Result
|
References
|
<div style="background:#FFFFFF; border: 3px solid #37A9FF;"> <div style="background:#FFFFFF; border: 4px solid #9A9A9A;"> <div style="background:#FFFFFF; border: 5px solid #F0F0F0;"> <div style="background:#FFFFFF; border: 4px solid #4955FF;"> <div style="background: #4955FF; background-image:linear-gradient(to bottom, #292929 0%, #37A9FF 100%);"> <div style="background: #3DFFF9; background-image:linear-gradient(to left, #FF4000 0%, #3DFFF9 50%, #1500FF 100%); border: 5px; color: #F9F9F9;-webkit-border-radius: 60px; padding: 15px;"> <div style="background: #3DFFF9; background-image:linear-gradient(to right, #00B415 0%, #9A9A9A 50%, #6328D8 100%); border: 12px; color: #F9F9F9;-webkit-border-radius: 55px; padding: 17px;"> <center> <span style="text-shadow: 0 -9px 7px; font-size: 41px;"> '''Heading''' </span> </center></div>'''Text goes here.''' </div></div></div></div></div></div></div>
Heading










