claire elford inspired layout!!

Tags: claire elford, witchs heart, coquette, anime

Description:

A layout inspired by claire elford from witch heart!! Im a beginner at css, sorry if it isnt very good.

Code:

<!-- (c) Layout created by Storm/xezzi☆ (https://layouts.spacehey.com/layout?id=94221) --> <style> body{ background: url(https://i.pinimg.com/564x/92/34/cf/9234cf0921d75cfa808390f4978fb269.jpg); } .profile{ background-color: #D8E0E8; } main{ background-color: transparent; } main:before { width: 100%; height: 200px ; display: block; content: ""; background-image: url('https://i.imgur.com/tjeOQwM.png'); background-position: center center; background-size: cover; } :root { --logo-blue: #B6C6D5; --darker-blue: #919EB4 ; --lighter-blue: #B6C6D5; --even-lighter-blue: #F3F7FF ; --lightest-blue: #F3F7FF; --dark-orange: #919EB4; --light-orange: #B6C6D5; --even-lighter-orange: #F3F7FF; --green: #B6C6D5; } .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: url("https://pixels.crd.co/assets/images/gallery24/c4cc987b.gif?v=1987e5e0") } .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before { /* Add to Favorites */ content: url("https://pixels.crd.co/assets/images/gallery24/37ffb81e.gif?v=1987e5e0") } .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before { /* Send Message */ content: url("https://pixels.crd.co/assets/images/gallery24/07b3b371.gif?v=1987e5e0") } .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before { /* Forward to Friend */ content: url("https://pixels.crd.co/assets/images/gallery46/38a20c1d.gif?v=1987e5e0") } .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before { /* Instant Message */ content: url("https://pixels.crd.co/assets/images/gallery87/74c8cc57.gif?v=1987e5e0") } .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before { /* Block User */ content: url("https://pixels.crd.co/assets/images/gallery99/6f827cf9.gif?v=1987e5e0") } .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before { /* Add to Group */ content: url("https://pixels.crd.co/assets/images/gallery143/f1b92e00.gif?v=1987e5e0") } .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before { /* Report Profile */ content: url("https://pixels.crd.co/assets/images/gallery99/3d9d0b00.gif?v=1987e5e0") } .online { visibility: hidden; } .online img { content: url("https://i7.glitter-graphics.org/pub/745/745447eyod5wufg2.gif"); animation-name: none; visibility: visible; height: 20px; width: 90px; } * { cursor: url(https://ani.cursors-4u.net/symbols/sym-8/sym757.ani), url(https://ani.cursors-4u.net/symbols/sym-8/sym757.png), auto !important; } .general-about img { -webkit-mask-image: url(https://i.postimg.cc/8cb1ctyg/heart.png); -webkit-mask-size: 100%; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; } </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.