Hybrid Theory EP - Linkin Park (1999)

Tags: linkin park, 90s, dark, 2000s, music, hybrid theory, metal, nu metal, emo

Description:

In 1999 Linkin Park went by the name of Hybrid Theory. The released a self-titled EP under their own record label; "Mix Media", but that was just a coverup as to make it not seem like a self-released EP. This layout is based on the cover art of said EP. The EP was later re-released as the first Linkin Park Underground (LPU for short) album in 2001. The original layout was made by HACKSAW, I simply edited it to make it based around the HT EP, as well as adding some very minor tweaks.

Preview:

Code:

<!-- (c) Layout created by ❦ Alexx Sixx ❦ (https://layouts.spacehey.com/layout?id=37148) --> <style> @import url('https://fonts.googleapis.com/css2?family=Anton&family=Orbitron:wght@900&display=swap'); p{ font-family: 'Orbitron', sans-serif; font-size: 100%; color: white; text-shadow: 1px 1px 1px black; } h1, h2, h3, h4, h5{ font-family: 'Orbitron', sans-serif; font-size: 100%; color: white; text-shadow: 1px 1px 1px black; } body { background:url(https://i.ibb.co/qN2Gfpy/cd8dde051ab84f079c7d6635548e3a13.png) fixed; } main { background: transparent; border: none; } :root { --logo-blue: transparent; --darker-blue: white; --lighter-blue: transparent; --even-lighter-blue: transparent ; --lightest-blue: transparent; --dark-orange: white; --light-orange:transparent; --even-lighter-orange:; --green: blue; } friends p, .friends a { color: grey; } a:hover { color: lightgrey; } a{ color: white; } } .count { color: lightgrey; } .profile .friends .person p { color: lightgrey; } .profile .friends .person p:hover { color: lightgrey; } friends p, .friends a { color: grey; } a:hover { color: lightgrey; } .count { color: grey; } nav .top{ background-image: linear-gradient(to bottom right,#B84E21,#000000,#8D659E); margin: 1em 0; text-align: center; border-radius: 25px; } nav .links{ background-image: linear-gradient(to bottom right, #B84E21,#000000,#8D659E); border-radius: 25px; display: flex; flex-wrap: wrap; justify-content: space-around; font-style: italic; } .profile .contact .heading, .profile .table-section .heading{ color: #7A007A; background-image: linear-gradient(to bottom right,#B84E21,#000000,#8D659E); border-radius: 25px; text-align: center; padding: .1em; } .profile .blurbs .heading, .profile .friends .heading{ color: #7A007A; background-image: linear-gradient(to bottom right, #B84E21,#000000,#8D659E); border-radius: 25px; text-align: center; padding: .1em; } footer{ background-image: linear-gradient(to bottom right, #B84E21,#000000,#8D659E); border-radius: 25px; font-style: italic; color: #520052; }</style> <style> body { cursor: url(https://cur.cursors-4u.net/cursors/cur-2/cur116.cur), auto; } } a:hover { color: lightgrey; } nav{ font-size: 13px !important; font-family: 'Orbitron', sans-serif; text-shadow: 1px 1px black; text-transform:none; padding-left:3px; text-align: center; } /* contact icons */ .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: url(https://i.imgur.com/GCCa893.gif); } .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before { /* add to favorite */ content: url(https://i.imgur.com/GCCa893.gif); } .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before { /* send a message */ content:url(https://i.imgur.com/GCCa893.gif); } .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before { /* forward to friend*/ content: url(https://i.imgur.com/GCCa893.gif); } .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before { /* instant message */ content: url(https://i.imgur.com/GCCa893.gif); } .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before { /* block user */ content: url(https://i.imgur.com/GCCa893.gif); } .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before { /* add 2 group */ content: url(https://i.imgur.com/GCCa893.gif); } .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before { /* report */ content: url(https://i.imgur.com/GCCa893.gif); } .friends { overflow: scroll; overflow-x: scroll; overflow-x: hidden; height: 300px; } count, .friends a p { color: white; } .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); } 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%) } } </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.