Minimalist (-> Code Custom Color)

Hukiolukio

Profile



<!--- Notes ---

- This profile uses custom colors, meaning you can change the colors to your liking.
- Use ctrl+f to find and replace each color
- Color 1: #819163

- Rules and more info: https://toyhou.se/~forums/16.htmlcss-graphics/39007.-free-html-templates

--------------->


<div class="container" style="color:#819163;"> 
  <div class="panel card-block rounded-0" style="height:75px;background-color:#819163;border-color:#819163;"></div>
  <div class="card card-block bg-faded rounded-0" style="border-width:5px;border-color:#819163;">
    <div class="row justify-content-between">
      <div class="col-lg-3 text-center">
      
        <!-- Put Image Here 
        Recommended to use a square image that is atleast 250x250px -->
        <img src="https://via.placeholder.com/250" style="margin-top:-50px;" class="img-thumbnail bg-faded border-0 rounded-circle mb-0" width="250">
        
      </div>
      <div class="col-lg-9">
        
        
        <!------- Top Line: Large Screens ------->
        <div class="d-none d-lg-block">
          <div class="row justify-content-between display-2">
            <div class="col-4 text-left mb-0">
              
              <!-- Put Name Here -->
              Name
              
            </div>
            <div class="col-4 text-center mb-0">
              
              <!-- Put Age Here -->
              Age
              
            </div>
            <div class="col-4 text-right mb-0">
              
              <!-- Put Gender Here -->
              Gender
              
            </div>
          </div>
        </div>
        
        <!------- Top Line: Small Screens ------->
        <div class="d-lg-none">
          <ul class="list-unstyled display-2 text-center">
            <li>
              
              <!-- Put Name Here -->
              Name
              
            </li>
            <li>
              
              <!-- Put Age Here -->
              Age
              
            </li>
            <li>
              
              <!-- Put Gender Here -->
              Gender
              
            </li>
          </ul>
        </div>
        
        <hr class="mt-3" style="border:1px dashed;">
          <p class="display-4 text-center">
            
            <!-- Put Quote Here -->
            "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
            
          </p>
        </hr>
        
        <!-- Paragraphs -->
        <p class="mt-2" style="text-align: justify;">Donec lectus mi, euismod id odio vitae, ullamcorper interdum tortor. Duis tempor, ex vel porta placerat, mi odio finibus ex, eget efficitur odio ex at turpis. Integer vitae elit felis. Phasellus fermentum lacinia ipsum, eu blandit arcu vulputate quis. Morbi facilisis, velit et feugiat gravida, nisi dui volutpat nisi, in varius tellus nisl sed mi. Sed pellentesque convallis enim nec vulputate. Aenean molestie condimentum tellus, nec semper magna tempor sed.</p>
        
      </div>
    </div>
  </div>
  
  <!-- Credits, Don't Remove -->
  <a class="tooltipster pull-right ml-2" style="color:#819163" href="https://toyhou.se/hukiolukio" title="code by hukiolukio">
    <i class="fa-solid fa-code"></i>
  </a>
  
  <!-- Artist Credit -->
  <a class="tooltipster pull-right" style="color:#819163" href="LINK" title="art by NAME">
    <i class="fa-solid fa-paintbrush"></i>
  </a>
 
</div>