The
pro account for entrepreneurs.

Much more than a bank, Front is the ideal, fastest and most convenient financial and administrative co-driver to work with peace of mind.

Contact Sales Get Started
Image Description

Integrate
quickly

Front lets you spend your development time on product improvements.

Image Description

Raphael Olston

Business
Image Description 
<!-- Hero Section -->
<div id="SVGHero" class="svg-preloader position-relative bg-white overflow-hidden">
  <div class="container position-relative z-index-2 space-top-2 space-bottom-3 space-top-md-4">
    <div class="row align-items-lg-center">
      <div class="col-lg-5 mb-11 mb-lg-0">
        <!-- Info -->
        <div class="mb-6">
          <h1 class="text-white font-weight-semi-bold mb-3">
            The
            <span class="text-indigo">
              <strong class="u-text-animation u-text-animation--typing"></strong>
            </span>
            <br>
            pro account for entrepreneurs.
          </h1>
          <p class="text-white-70">Much more than a bank, Front is the ideal, fastest and most convenient financial and administrative co-driver to work with peace of mind.</p>
        </div>

        <a class="btn btn-white btn-wide btn-pill text-primary shadow-soft transition-3d-hover mb-2 mb-sm-0 mr-4" href="#">Contact Sales</a>
        <a class="btn btn-indigo btn-wide btn-pill transition-3d-hover mb-2 mb-sm-0" href="#">Get Started</a>
        <!-- End Info -->
      </div>

      <div class="col-lg-7">
        <div class="position-relative">
          <!-- SVG Laptop Mockup -->
          <figure class="ie-devices-v4-laptop mb-3 mb-sm-0">
            <img class="js-svg-injector" src="../../assets/svg/components/laptop.svg" alt="Image Description"
                 data-img-paths='[
                   {"targetId": "#SVGlaptopImg1", "newPath": "../../assets/img/1618x1010/img3.jpg"}
                 ]'
                 data-parent="#SVGHero">
          </figure>
          <!-- SVG Laptop Mockup -->

          <!-- Card Info -->
          <div class="position-sm-absolute bottom-0 right-0 max-width-40 ml-auto mb-sm-n5">
            <div class="card border-0 bg-primary shadow-primary-lg rounded p-5">
              <h2 class="h5 text-white font-weight-semi-bold mb-3">Integrate<br>quickly</h2>

              <p class="text-info">Front lets you spend your development time on product improvements.</p>

              <!-- Avatar -->
              <div class="media align-items-center">
                <div class="u-sm-avatar u-sm-avatar--bordered rounded-circle mr-2">
                  <img class="img-fluid rounded-circle" src="../../assets/img/32x32/img6.jpg" alt="Image Description">
                </div>
                <div class="media-body">
                  <h3 class="font-size-1 text-white font-weight-medium mb-0">Raphael Olston</h3>
                  <small class="d-block text-light font-weight-light">Business</small>
                </div>
              </div>
              <!-- End Avatar -->
            </div>
          </div>
          <!-- Enc Card Info -->
        </div>
      </div>
    </div>
  </div>

  <!-- SVG Background Shape -->
  <div class="gradient-overlay-half-primary-v3 svg-divider-polygon position-absolute top-0 right-0 bottom-0 left-0">
    <figure class="ie-circles-hero">
      <img class="js-svg-injector d-none d-lg-block" src="../../assets/svg/components/circles.svg" alt="Image Description"
           data-parent="#SVGHero">
    </figure>
  </div>
  <!-- End SVG Background Shape -->
</div>
<!-- End Hero Section -->
Copy
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>

<!-- JS Front -->
<script src="../../assets/js/components/hs.svg-injector.js"></script>

<!-- JS Plugins Init. -->
<script>
  $(window).on('load', function () {
    // initialization of svg injector module
    $.HSCore.components.HSSVGIngector.init('.js-svg-injector');
  });
</script>
Copy