### Page Headers

Header 1

Copy

    <!-- -------- START HEADER 1 w/ text and image on right ------- -->
    <header>
      <div class="page-header section-height-100">
        <div class="oblique position-absolute top-0 h-100 d-md-block d-none">
          <div class="oblique-image bg-cover position-absolute fixed-top ms-auto h-100 z-index-0 ms-n6" style="background-image:url(../../assets/img/curved-images/curved11.jpg)"></div>
        </div>
        <div class="container">
          <div class="row">
            <div class="col-lg-6 col-md-7 d-flex justify-content-center flex-column">
              <h1 class="text-gradient text-primary">Your Work With</h1>
              <h1 class="mb-4">Soft Design System</h1>
              <p class="lead pe-5 me-5">The time is now for it be okay to be great. People in this world shun people for being nice. </p>
              <div class="buttons">
                <button type="button" class="btn bg-gradient-primary mt-4">Get Started</button>
                <button type="button" class="btn text-primary shadow-none mt-4">Read more</button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </header>
    <!-- -------- END HEADER 1 w/ text and image on right ------- -->

Header 2

Screenshot
Get the Code

Header 3

Screenshot
Get the Code

Header 4

Screenshot
Get the Code

Header 5

Screenshot
Get the Code

Header 6

Screenshot
Get the Code

Header 7

Screenshot
Get the Code

Header 8

Screenshot
Get the Code

Header 9

Screenshot
Get the Code

Header 10

Screenshot
Get the Code