index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Diullei</title>
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@500&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css"
        integrity="sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA=="
        crossorigin="anonymous" />
</head>

<body>
    <style>
        body {
            background-color: #242424;
            color: white;
        }

        .name-container {
            margin: auto;
            width: 50%;
            padding: 10px;
            text-align: center;
        }

        .name-container a {
            text-decoration: none;
        }

        .name {
            margin-top: 10%;
            font-family: 'M PLUS 1p', sans-serif;
            font-size: 3rem;
        }

        .name a {
            color: #cfcfcf;
        }

        .flex-control-nav {
            margin-top: -10px;
            padding-inline-start: 0px;
            font-size: 2rem;
        }

        .flex-control-nav li {
            display: inline;
        }

        .flex-control-nav a>span {
            font-size: 0;
        }

        .flex-control-nav .fa-github {
            color: white;
        }

        .flex-control-nav .fa-stack-overflow {
            color: #F48024;
        }

        .flex-control-nav .fa-twitter {
            color: #1DA1F2;
        }

        .flex-control-nav .fa-linkedin {
            color: #0e76a8;
        }
    </style>

    <div class="name-container">
        <div class="name"><a href="/">Diullei</a></div>
        <ul class="flex-control-nav">
            <li><a href="http://github.com/Diullei"><i class="fab fa-github"></i><span>Github</span></a></li>
            <li><a href="https://stackoverflow.com/users/1614863/diullei"><i class="fab fa-stack-overflow"></i><span>Stackoverflow</span></a></li>
            <li><a href="https://twitter.com/diullei"><i class="fab fa-twitter"></i><span>Twitter</span></a></li>
            <li><a href="https://www.linkedin.com/in/diullei/"><i class="fab fa-linkedin"></i><span>Linkedin</span></a></li>
        </ul>
    </div>
</body>

</html>