Form

Change the look of an HTML form.

Form Validation

Success

Info

Warning

Error

Sign Up Form

<div class="ss-container">
  <form action="/sign-up" method="post" enctype="multipart/form-data">
    <fieldset class="ss-fieldset">
      <legend class="ss-legend">Register</legend>
      <label for="name" class="ss-label">Full Name</label>
      <input type="text" id="name" name="name" placeholder="John Doe" class="ss-input">
      <label for="email" class="ss-label">Email Address</label>
      <input type="email" id="email" name="email" placeholder="johndoe@example.com" class="ss-input">
      <label for="gender" class="ss-label">Gender</label>
      <select id="gender" name="gender" class="ss-select">
        <option disabled selected>Please select</option>
        <option value="male">Male</option>
        <option value="female">Female</option>
        <option value="custom">Custom</option>
      </select>
      <label for="picture" class="ss-label">Image</label>
      <input type="file" id="picture" name="picture" class="ss-input">
      <label for="info" class="ss-label">More About You</label>
      <textarea id="info" name="info" rows="10" class="ss-textarea"></textarea>
      <label for="newsletter" class="ss-label">
        <input type="checkbox" id="newsletter" name="newsletter">
        Subscribe to newsletter
      </label>
      <input type="submit" value="Submit" class="ss-btn ss-outline">
    </fieldset>
  </form>
</div>