Rounded - Bootstrap

<div class="p-0 col-md-9 mx-auto">
    <div class="m-3 card border-0 bg-faded" style="border-radius: 40px;">
        <!-- HEADER -->
        <div class="p-1 pl-3 card-header bg-secondary" style="background: url('https://cdn.discordapp.com/attachments/579088492152487946/800916228034002965/constellations_small.png'); border-radius: 40px 40px 0px 0px;">
            <!-- NAME - change #FFFFFF to a color of your choosing, according to your background -->
            <h1 class="m-0 ml-2 display-3 justify-content-between" style="color: #FFFFFF;">
                Name
                <span><i class="mr-2 fal fa-star"></i></span>
            </h1>

            <!-- STAMP/RIBBON ROW -->
            <div class="m-0 row justify-content-center">
                <div class="m-1 p-0 col-auto">
                    <img src="//via.placeholder.com/100"></div>
                <div class="m-1 p-0 col-auto">
                    <img src="//via.placeholder.com/100"></div>
                <div class="m-1 p-0 col-auto">
                    <img src="//via.placeholder.com/100"></div>
                <div class="m-1 p-0 col-auto">
                    <img src="//via.placeholder.com/100"></div>
            </div>
        </div>
        <!-- CONTENT -->
        <div class="m-0 row">
            <!-- LEFT -->
            <div class="p-2 col-lg-8" style="height: 300px; overflow: auto;">
                <h1 class="font-weight-light text-primary" style="border-bottom: 1px solid;">ABOUT</h1>
                <!-- CONTENT -->
                <div class="mt-3 mb-2 text-center">
                    <!-- IMAGE -->
                    <img class="img-thumbnail rounded-circle" src="//via.placeholder.com/200" style=" height: 130px; width: 130px;">

                    <p class="m-0 text-secondary text-uppercase">
                        adj <i class="fas fa-caret-right fa-lg"></i>
                        pronouns <i class="fas fa-caret-left fa-lg"></i>
                        adj
                    </p>
                    <!-- PARAGRAPH -->
                    <p class="mt-1 m-0">Introduce yourself here. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec efficitur magna eu facilisis aliquet. Quisque dictum nunc nec sollicitudin elementum. Nam a quam ac dui congue venenatis quis at tortor. Sed in varius ante, id porttitor mi. Integer malesuada justo non justo eleifend condimentum. Vestibulum nulla tortor, vehicula id elit ut, ullamcorper sollicitudin ex. Ut vehicula a purus egestas vestibulum. Curabitur nulla leo, sagittis sed finibus non, sagittis ac leo.</p>
                </div>
            </div> <!-- end left -->
            <!-- RIGHT -->
            <div class="p-1 col-lg-4">
                <div class="mt-5 mx-2 font-weight-bold text-uppercase text-right">
                    <p class="mb-4">
                        <span class="pull-left text-secondary">Requests</span>
                        <span>closed</span>
                    </p>
                    <p class="mb-4">
                        <span class="pull-left text-secondary">Trades</span>
                        <span>mutuals/friends</span>
                    </p>
                    <p class="mb-4">
                        <span class="pull-left text-secondary">Comissions</span>
                        <span>open</span>
                    </p>
                    <!-- BUTTONS -->
                    <div class="m-0 row justify-content-center">
                        <!-- twitter -->
                        <a href="LINK" class="m-1 p-2 col-auto btn btn-primary rounded-circle" style="height: 40px; width: 40px;">
                            <i class="my-1 mx-auto fab fa-lg fa-twitter"></i></a>
                        <!-- deviantart -->
                        <a href="LINK" class="m-1 p-2 col-auto btn btn-primary rounded-circle" style="height: 40px; width: 40px;">
                            <i class="my-1 mx-auto fab fa-lg fa-deviantart"></i></a>
                        <!-- youtube -->
                        <a href="LINK" class="m-1 p-2 col-auto btn btn-primary rounded-circle" style="height: 40px; width: 40px;">
                            <i class="my-1 mx-auto fab fa-lg fa-youtube"></i></a>
                        <!-- tumblr -->
                        <a href="LINK" class="m-1 p-2 col-auto btn btn-primary rounded-circle" style="height: 40px; width: 40px;">
                            <i class="my-1 mx-auto fab fa-lg fa-tumblr"></i></a>
                        <!-- instagram -->
                        <a href="LINK" class="m-1 p-2 col-auto btn btn-primary rounded-circle" style="height: 40px; width: 40px;">
                            <i class="my-1 mx-auto fab fa-lg fa-instagram"></i></a>
                    </div>
                </div>
            </div> <!-- end right -->
        </div>
        <!-- CREDIT -->
        <div class="p-1 text-center">
            <a data-toggle="tooltip" title="Code by SparklyCodes" href="/SparklyCodes"><i class="fal fa-code"></i></a>
            <a data-toggle="tooltip" title="Layout by toffeebuns" href="/toffeebuns"><i class="fal fa-paint-brush"></i></a>
        </div>
    </div>
</div>