This is a <h1>

This is a <h2>

This is a <h3>

This is a <h4>

This is a <h5>

This is a <h6>

This is a paragraph <p>

<a> Google Website </a>

<button> .l-btn-dark .l-btn-success .l-btn-main .l-btn-danger

a-link with same button class act the same:

<a class=".l-btn-dark"></a>

A form:

<input type="checkbox"> <label class="l-chk-lbl"> one two

<input type="radio"> <label class="l-rdo-lbl"> one two

This is option 1 This is option 2 This is option 3 Submit form

console.log("this is a <pre> tag in action")

Header default view:

LOGO

Home

Card

Card

<header class="l-header-separated">
  <div class="l-left-box">
    <div>LOGO</div>
  </div>
  <div class="l-right-box">
    <div>Home</div>
    <div>Card</div>
  <div>Card</div>
  </div>
</header>