Terezi Pyrope Homestuck layout

Tags: homestuck

Description:

Terezi themed layout with floating profile animation, a terezi sprite below the interests box, and a custom online icon! Made with different pieces of code, so change it up however you’d like! Just comment if used

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by Sip O' Poison (https://layouts.spacehey.com/layout?id=40602) -->

<style>
    .table-section + .table-section {
        display: none;
    }
</style>

<style>
div.table-section:nth-child(odd):after {
 content: url(http://media.tumblr.com/tumblr_lykbpwdECO1r41mo2.gif); 
}
</style>

<style>

/*the username glow and shadow*/
h1
{
	color: /*the username glow and shadow*/
h1
{         color: #6ec2c2; 
	//text-shadow: 1px 1px #6ec2c2;
	
};
	text-shadow: 2px 2px 3px #6ec2c2, 0 0 25px #6ec2c2, 0 0 5px black;
}

</style>

<style>.online { visibility: hidden; } .online img { content: url("https://homestuck.net/img/resources/assets/troll-sprites/terezi-sprites/Terezi_Stand.png"); animation-name: none; visibility: visible; 
height: 135px; width: 120px; }</style>

<style>
body {
 margin:0;
 background-image: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/a80ce302-40cd-4d8d-81bf-f3d49237fe25/dg85b5s-0bb8b8f5-3b12-4f7f-980d-482f2ec718e1.png/v1/fill/w_1003,h_796,q_70,strp/teresa_pyrope_by_p4ntysh0t_dg85b5s-pre.jpg?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9MTA3MSIsInBhdGgiOiJcL2ZcL2E4MGNlMzAyLTQwY2QtNGQ4ZC04MWJmLWYzZDQ5MjM3ZmUyNVwvZGc4NWI1cy0wYmI4YjhmNS0zYjEyLTRmN2YtOTgwZC00ODJmMmVjNzE4ZTEucG5nIiwid2lkdGgiOiI8PTEzNDkifV1dLCJhdWQiOlsidXJuOnNlcnZpY2U6aW1hZ2Uub3BlcmF0aW9ucyJdfQ.yQeNa4gaQCBJrDezG1hqA9Y44XNqnhaj4uW2XDZJsL8");
background-attachment: fixed;
no-repeat fixed; background-size:cover;

}

body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%);
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}

.logo {
filter: sepia(100%) hue-rotate(45deg) saturate(0);
}

#q, button {
color: #6ec2c2;
background-color: transparent;
border: 1px dotted #008282;
font-family: inherit;
}
p, i, b, .count {
color: #6ec2c2!important;
}
a, .profile .friends .person p, .logout-btn {
color: #6ec2c2 !important;
text-decoration: underline !important;
}
.container {
margin: 0 auto 0;
}
.icon {
display: none;
}
nav, nav .links a {
color: #6ec2c2;
}
nav .top {
margin-top: 2px;
background: none;
background-color: rgba(0, 0, 0, 0.5);
border: 2px dotted #008282;
border-bottom: none;
}
nav .links {
background-color: rgba(0, 0, 0, 0.5);
border: 2px dotted #008282;
text-align: center;
}
main {
background: black;
background-color: rgba(0, 0, 0, 0.5);
color: #6ec2c2;
border-left: 2px dotted #008282;
border-right: 2px dotted #008282;
border-bottom: 2px dotted #008282;
}
.heading {
color: #008282!important;
background: none;
background-color: black !important;
border: 2px solid #008282 !important;
}

.url-info {
color: #008282!important;
background: none;
background-color: transparent !important;
border: 2px dotted #008282 !important;
}

.inner {
color: #008282!important;
border: 2px dotted #008282;
border-top: none;
}
.profile-info {
border: 2px dotted #008282;
}
.profile-info .inner {
border: none;
}
.friends .inner {
border-bottom: none;
}
#comments {
border-bottom: 2px dotted #008282;
}
.profile .contact, .profile .table-section, .home-actions {
border: none !important;
}

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

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* add to friends */
content: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ac0f4740-0a93-4c32-9553-fa4f1e4770fc/daeabt2-9b3b8278-3f0a-4d8a-ad1e-57594241ce1a.png/v1/fill/w_18,h_18/orb_teal_by_kayosa_stock_daeabt2-fullview.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9MTgiLCJwYXRoIjoiXC9mXC9hYzBmNDc0MC0wYTkzLTRjMzItOTU1My1mYTRmMWU0NzcwZmNcL2RhZWFidDItOWIzYjgyNzgtM2YwYS00ZDhhLWFkMWUtNTc1OTQyNDFjZTFhLnBuZyIsIndpZHRoIjoiPD0xOCJ9XV0sImF1ZCI6WyJ1cm46c2VydmljZTppbWFnZS5vcGVyYXRpb25zIl19.bGnmL4nWoCzgR0Y1wCksJ87rFwNqmJo3GDwpDt6fyZ4")
}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ac0f4740-0a93-4c32-9553-fa4f1e4770fc/daeabt2-9b3b8278-3f0a-4d8a-ad1e-57594241ce1a.png/v1/fill/w_18,h_18/orb_teal_by_kayosa_stock_daeabt2-fullview.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9MTgiLCJwYXRoIjoiXC9mXC9hYzBmNDc0MC0wYTkzLTRjMzItOTU1My1mYTRmMWU0NzcwZmNcL2RhZWFidDItOWIzYjgyNzgtM2YwYS00ZDhhLWFkMWUtNTc1OTQyNDFjZTFhLnBuZyIsIndpZHRoIjoiPD0xOCJ9XV0sImF1ZCI6WyJ1cm46c2VydmljZTppbWFnZS5vcGVyYXRpb25zIl19.bGnmL4nWoCzgR0Y1wCksJ87rFwNqmJo3GDwpDt6fyZ4")
}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ac0f4740-0a93-4c32-9553-fa4f1e4770fc/daeabt2-9b3b8278-3f0a-4d8a-ad1e-57594241ce1a.png/v1/fill/w_18,h_18/orb_teal_by_kayosa_stock_daeabt2-fullview.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9MTgiLCJwYXRoIjoiXC9mXC9hYzBmNDc0MC0wYTkzLTRjMzItOTU1My1mYTRmMWU0NzcwZmNcL2RhZWFidDItOWIzYjgyNzgtM2YwYS00ZDhhLWFkMWUtNTc1OTQyNDFjZTFhLnBuZyIsIndpZHRoIjoiPD0xOCJ9XV0sImF1ZCI6WyJ1cm46c2VydmljZTppbWFnZS5vcGVyYXRpb25zIl19.bGnmL4nWoCzgR0Y1wCksJ87rFwNqmJo3GDwpDt6fyZ4")
}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ac0f4740-0a93-4c32-9553-fa4f1e4770fc/daeabt2-9b3b8278-3f0a-4d8a-ad1e-57594241ce1a.png/v1/fill/w_18,h_18/orb_teal_by_kayosa_stock_daeabt2-fullview.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9MTgiLCJwYXRoIjoiXC9mXC9hYzBmNDc0MC0wYTkzLTRjMzItOTU1My1mYTRmMWU0NzcwZmNcL2RhZWFidDItOWIzYjgyNzgtM2YwYS00ZDhhLWFkMWUtNTc1OTQyNDFjZTFhLnBuZyIsIndpZHRoIjoiPD0xOCJ9XV0sImF1ZCI6WyJ1cm46c2VydmljZTppbWFnZS5vcGVyYXRpb25zIl19.bGnmL4nWoCzgR0Y1wCksJ87rFwNqmJo3GDwpDt6fyZ4")
}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ac0f4740-0a93-4c32-9553-fa4f1e4770fc/daeabt2-9b3b8278-3f0a-4d8a-ad1e-57594241ce1a.png/v1/fill/w_18,h_18/orb_teal_by_kayosa_stock_daeabt2-fullview.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9MTgiLCJwYXRoIjoiXC9mXC9hYzBmNDc0MC0wYTkzLTRjMzItOTU1My1mYTRmMWU0NzcwZmNcL2RhZWFidDItOWIzYjgyNzgtM2YwYS00ZDhhLWFkMWUtNTc1OTQyNDFjZTFhLnBuZyIsIndpZHRoIjoiPD0xOCJ9XV0sImF1ZCI6WyJ1cm46c2VydmljZTppbWFnZS5vcGVyYXRpb25zIl19.bGnmL4nWoCzgR0Y1wCksJ87rFwNqmJo3GDwpDt6fyZ4")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ac0f4740-0a93-4c32-9553-fa4f1e4770fc/daeabt2-9b3b8278-3f0a-4d8a-ad1e-57594241ce1a.png/v1/fill/w_18,h_18/orb_teal_by_kayosa_stock_daeabt2-fullview.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9MTgiLCJwYXRoIjoiXC9mXC9hYzBmNDc0MC0wYTkzLTRjMzItOTU1My1mYTRmMWU0NzcwZmNcL2RhZWFidDItOWIzYjgyNzgtM2YwYS00ZDhhLWFkMWUtNTc1OTQyNDFjZTFhLnBuZyIsIndpZHRoIjoiPD0xOCJ9XV0sImF1ZCI6WyJ1cm46c2VydmljZTppbWFnZS5vcGVyYXRpb25zIl19.bGnmL4nWoCzgR0Y1wCksJ87rFwNqmJo3GDwpDt6fyZ4")
}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ac0f4740-0a93-4c32-9553-fa4f1e4770fc/daeabt2-9b3b8278-3f0a-4d8a-ad1e-57594241ce1a.png/v1/fill/w_18,h_18/orb_teal_by_kayosa_stock_daeabt2-fullview.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9MTgiLCJwYXRoIjoiXC9mXC9hYzBmNDc0MC0wYTkzLTRjMzItOTU1My1mYTRmMWU0NzcwZmNcL2RhZWFidDItOWIzYjgyNzgtM2YwYS00ZDhhLWFkMWUtNTc1OTQyNDFjZTFhLnBuZyIsIndpZHRoIjoiPD0xOCJ9XV0sImF1ZCI6WyJ1cm46c2VydmljZTppbWFnZS5vcGVyYXRpb25zIl19.bGnmL4nWoCzgR0Y1wCksJ87rFwNqmJo3GDwpDt6fyZ4")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ac0f4740-0a93-4c32-9553-fa4f1e4770fc/daeabt2-9b3b8278-3f0a-4d8a-ad1e-57594241ce1a.png/v1/fill/w_18,h_18/orb_teal_by_kayosa_stock_daeabt2-fullview.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9MTgiLCJwYXRoIjoiXC9mXC9hYzBmNDc0MC0wYTkzLTRjMzItOTU1My1mYTRmMWU0NzcwZmNcL2RhZWFidDItOWIzYjgyNzgtM2YwYS00ZDhhLWFkMWUtNTc1OTQyNDFjZTFhLnBuZyIsIndpZHRoIjoiPD0xOCJ9XV0sImF1ZCI6WyJ1cm46c2VydmljZTppbWFnZS5vcGVyYXRpb25zIl19.bGnmL4nWoCzgR0Y1wCksJ87rFwNqmJo3GDwpDt6fyZ4")
}

.profile .contact .f-row:first-of-type {
margin-top: 0px;
padding-top: 7px;
}
.profile .blurbs .section h4 {
color: #008282!important;
text-align: center;
}
.details-table {
margin: 2px;
}
.details-table, td {
border: 1px dotted #008282;
border-collapse: collapse;
}
td {
color: #008282!important;
background: none;
background-color: transparent !important;
} 
table.details-table {
max-width: 98%;
}
.profile h1 {
font-size: 2em;
color: #008282;
}
footer {
background-color: rgba(0, 0, 0, 0.5);
border: 2px dotted #008282;
}
footer p {
color #008282 !important;
}
.comments-table {
border: none;
border-collapse: collapse;
}
.comment-replies {
border: 1px dotted #008282;
margin: 2px;
}
nav .info {
background: none;
}

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



<style>
table.comments-table{
background-color: rgba(0, 0, 0, 0.5);
display: block;
height: 300px!important;
overflow-y: scroll;

}
</style>



<style>
    ::-webkit-scrollbar {
    width: 8px;
    height: 10px;}

    ::-webkit-scrollbar-thumb {
    background: #008282;}

    ::-webkit-scrollbar-track {
    background:black;}
</style>

<style>
    .comments-table td:first-child{
background-color: rgba(0, 0, 0, 0.5);

}

.comments-table td{
border-width:0;
background-color: rgba(0, 0, 0, 0.5);
border: 2px dotted #008282;
</style>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

Displaying 20 of 33 comments ( View all | Add Comment )

-TesticleKicker-	1768506912 Usando <3 Report Comment
jess :03	1764226454 using !! Report Comment
GallowsCalibrator	1763965095 Using Report Comment
Fakaii	1762138452 Using Report Comment
Alamorin	1761509136 US1NG!!!! H3H3H3 Report Comment
DragoxzKiller	1760857912 Using!!! Report Comment
CreativeDeadbeat	1756055261 US1NG! Report Comment
starshine	1746987512 using :] Report Comment
T3R3Z1	1742135704 US1NG! Report Comment
kriskross	1741733212 IM USIN THIS Report Comment
gloomia.doom	1731029829 USING Report Comment
TheLordOfJunk	1730078209 using Report Comment
Z1NK	1728745861 US1NG1!!1 Report Comment
dubious_goofer	1727443717 USING >:] Report Comment
Protagonist]	1719482542 US1NG!!! Report Comment
Protagonist]	1719482542 US1NG!!! Report Comment
L14	1717455899 US1NG!! Report Comment
Helena Grace	1717218508 using!!! Report Comment
Sam	1716894376 using Report Comment
Jane Crocker :B	1713649149 US1NG >:] Report Comment