---
layout: signup
title: Signup
---

<!--Fake navigation-->
<div class="fake-nav">
  <a href="/" class="logo">
    <img
      class="light-image"
      src="assets/img/vector/logo/friendkit-bold.svg"
      width="112"
      height="28"
      alt=""
    />
    <img
      class="dark-image"
      src="assets/img/vector/logo/friendkit-white.svg"
      width="112"
      height="28"
      alt=""
    />
  </a>
</div>

<div class="container">
  <!--Container-->
  <div class="login-container is-centered">
    <div class="columns is-vcentered">
      <div class="column">
        <h2 class="form-title has-text-centered">Hey there!</h2>
        <h3 class="form-subtitle has-text-centered">
          Lets create your account.
        </h3>

        <!--Form-->
        <div class="login-form">
          <div class="form-panel">
            <div class="columns is-multiline">
              <div class="column is-6">
                <div class="field">
                  <label>First Name</label>
                  <div class="control">
                    <input
                      type="text"
                      class="input"
                      placeholder="Enter your first name"
                    />
                  </div>
                </div>
              </div>
              <div class="column is-6">
                <div class="field">
                  <label>Last Name</label>
                  <div class="control">
                    <input
                      type="text"
                      class="input"
                      placeholder="Enter your last name"
                    />
                  </div>
                </div>
              </div>
              <div class="column is-12">
                <div class="field">
                  <label>Email</label>
                  <div class="control">
                    <input
                      type="text"
                      class="input"
                      placeholder="Enter your email address"
                    />
                  </div>
                </div>
              </div>
              <div class="column is-12">
                <div class="field">
                  <label>Password</label>
                  <div class="control">
                    <input
                      type="password"
                      class="input"
                      placeholder="Enter your password"
                    />
                  </div>
                </div>
              </div>
              <div class="column is-12">
                <div class="field is-flex">
                  <div class="switch-block">
                    <label class="f-switch">
                      <input type="checkbox" class="is-switch" />
                      <i></i>
                    </label>
                    <div class="meta">
                      <p>Subscribe to Newsletter?</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <div class="buttons mt-2">
            <a class="button is-solid primary-button is-fullwidth raised"
              >Create Account</a
            >
          </div>

          <div class="account-link has-text-centered">
            <a href="/login-boxed.html">Have an account? Sign In</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>