Matrix code terminal 3D Layout

Tags: simple, dark, code, matrix, 3d, green

Description:

A simple, minimalistic layout with green terminal color pallete and a 3D neat effect There are some comments inside the code to change some sections of the code

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by .Sabitsuke (https://layouts.spacehey.com/layout?id=97829) -->

<style>
    @import url('https://fonts.cdnfonts.com/css/pf-tempesta-seven');

    body {
        background-image: url('https://i.pinimg.com/originals/c5/9a/d2/c59ad2bd4ad2fbacd04017debc679ddb.gif');
        background-size: cover;
        background-color: black;
        font-family: 'PF Tempesta Seven', sans-serif;
        font-family: 'PF Tempesta Seven Extended', sans-serif;
        font-family: 'PF Tempesta Seven Condensed', sans-serif;
        font-family: 'PF Tempesta Seven Compressed', sans-serif;
    }

    body::before {

        content: " ";
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background: linear-gradient(rgba(100, 100, 100, 0.185) 50%, rgb(0 0 0 / 0%) 50%);
        z-index: 5;
        background-size: 100% 2px, 3px 100%;
        pointer-events: none;

    }

    nav {
        width: 70% !important;
        margin: 2% 15% 0px !important;
        transform: rotateX(-50deg) !important;
        border: 0px !important;
        box-shadow: -2px 0 0 0 #4E9F3D,
            2px 0 0 0 #4E9F3D,
            0 -2px 0 0 #4E9F3D,
            0 2px 0 0 #4E9F3D
    }

    nav .top {
        background-color: #14101d !important;

    }

    nav .links {
        background-color: #1E5128 !important;

    }

    main {
        background-color: transparent !important;
    }

    .container {
        width: 100% !important;
        perspective: 1000px;
    }

    .profile {
        margin-top: 10%;

        display: flex;
        justify-content: space-evenly;
        -webkit-perspective: 900px;
        perspective: 1000px;
    }

    .profile div.col.w-40.left {
        transform: rotateY(10deg) !important;
        width: 500px;
        border: 0px !important;
        box-shadow: -2px 0 0 0 #4E9F3D,
            2px 0 0 0 #4E9F3D,
            0 -2px 0 0 #4E9F3D,
            0 2px 0 0 #4E9F3D
    }


    .profile div.col.right {
        transform: rotateY(-10deg) !important;
        width: 500px;
        border: 0px !important;
        box-shadow: -2px 0 0 0 #4E9F3D,
            2px 0 0 0 #4E9F3D,
            0 -2px 0 0 #4E9F3D,
            0 2px 0 0 #4E9F3D
    }

    .details-table td:first-child {
        background-color: #1E5128 !important;
        text-align: center !important;
    }

    .details-table td {
        background-color: #14101d !important;

    }

    .profile .contact,
    .profile .url-info,
    .profile .table-section,
    .setting-section,
    .home-actions {
        border: 0px !important;
        background-color: #14101d;
        box-shadow: -2px 0 0 0 #4E9F3D,
            2px 0 0 0 #4E9F3D,
            0 -2px 0 0 #4E9F3D,
            0 2px 0 0 #4E9F3D
    }

    h4 {
        color: #D8E9A8 !important;
    }

    p {
        color: white;
    }

    a {
        color: #D8E9A8 !important;
    }

    .profile .contact .heading,
    .profile .table-section .heading,
    .setting-section .heading,
    .home-actions .heading {
        background: #4E9F3D !important;
    }

    footer {
        background-color: transparent !important;
        color: white !important;
    }

    footer a {
        color: #D8E9A8 !important;
    }

    .profile .blurbs {
        background-color: #14101d;
        box-shadow: -2px 0 0 0 #4E9F3D,
            2px 0 0 0 #4E9F3D,
            0 -2px 0 0 #4E9F3D,
            0 2px 0 0 #4E9F3D
    }

    .profile .blurbs .heading {
        background-color: #4E9F3D !important;
    }

    /* friends  */

    .person a img {
      border-radius: 15px;
    }
    .profile .friends .person p {
        color: white !important;
    }
    .friends .heading {
        background-color: #4E9F3D !important;

    }

    /* Friends comments */

    .comments-table {
        border: none !important;
        box-shadow: -2px 0 0 0 #4E9F3D,
            2px 0 0 0 #4E9F3D,
            0 -2px 0 0 #4E9F3D,
            0 2px 0 0 #4E9F3D;
    }

    .comments-table tbody tr td:first-child {
        background-color: #1E5128 !important;
    }

    .comments-table tbody tr td:last-child {
        background-color: #14101d !important;
    }

    /* Comments replies */
    .comment-replies {
        border: none !important;
        box-shadow: -2px 0 0 0 #4E9F3D,
            2px 0 0 0 #4E9F3D,
            0 -2px 0 0 #4E9F3D,
            0 2px 0 0 #4E9F3D;
        margin: 2px;
    }

    /* logo  */
    .logo {
        border-radius: 10px !important;
        width: min-content;
        filter: invert(54%) sepia(61%) saturate(447%) hue-rotate(63deg) brightness(87%) contrast(92%);
    }

    /* contact symbols  */
    .contact .inner a img {
        font-size: 0 !important;
        padding-bottom: 5%;
    }
</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 30 comments ( View all | Add Comment )

wabungus	1713900271 which part controls the crt lines!! i accidentally broke it on my profile and dont remember what the code was,, Report Comment
noxfeelinqs	1713736173 Using! Report Comment
﹕⠀⠀⠀BIVE⠀⠀⠀⠀// ﹒	1712412995 CAN YOU MAKE THE CONTAINERS LIKE,,, closer to eachother ?? if that makes sense PLEASE I NEDH ELP Report Comment
Aurora	1711942974 using Report Comment
Rkizzle0126	1711345248 Using :P Report Comment
˗ˋACE´ˎ	1710708425 using!! Report Comment
zombeh	1710028539 Using Report Comment
shayne!! :P	1710022813 using Report Comment
⚚ 𓈒 EDWARD	1709029708 using! Report Comment
kittycat__Lover	1708667188 USING Report Comment
kittycat__Lover	1708667188 USING Report Comment
david	1708598732 usando Report Comment
𝐘𝐎𝐔𝐓𝐇𝐀𝐍𝐀𝐒𝐈𝐀	1708590584 using!! Report Comment
Hunter	1708547880 using Report Comment
Pakoowayi	1708498172 using! Report Comment
MasterFully	1708495256 Using Report Comment
valexxarv	1707614171 using Report Comment
Angeloo	1707585027 Using Report Comment
VIC!!!	1707024048 USING!!! Report Comment
C90RPS	1707019793 using! Report Comment