Library Application Forms Tenant Application Form

Tenant Application Form

Thank you for taking an interest in renting one of our properties. Please fill in this form with the needed information.

Form Preview

Tenancy details

Applicant details

This is a preview. The actual form will be fully interactive.

Get the code

Copy and paste this code into your website. Don't forget to replace your-endpoint with your actual 000form endpoint URL.

HTML Complete HTML form with 000form endpoint 
<form action="https://000form.com/f/your-endpoint" method="POST" class="tenant-form">
  <h3>Tenant Application Form</h3>
  <p class="form-description">
    Thank you for taking an interest in renting one of our properties. 
    Please fill in this form with the needed information.
  </p>

  <h4>Tenancy details</h4>
  
  <div class="form-group">
    <label for="property_address">Property address</label>
    <input type="text" id="property_address" name="property_address" 
           placeholder="Street Address" required>
    <input type="text" id="property_address2" name="property_address2" 
           placeholder="Street Address Line 2">
  </div>

  <div class="form-row">
    <div class="form-group">
      <label for="city">City</label>
      <input type="text" id="city" name="city" placeholder="City" required>
    </div>
    <div class="form-group">
      <label for="region">Region</label>
      <input type="text" id="region" name="region" placeholder="Region" required>
    </div>
  </div>

  <div class="form-row">
    <div class="form-group">
      <label for="postal_code">Postal / Zip Code</label>
      <input type="text" id="postal_code" name="postal_code" 
             placeholder="Postal / Zip Code" required>
    </div>
    <div class="form-group">
      <label for="country">Country</label>
      <input type="text" id="country" name="country" value="USA" 
             placeholder="Country">
    </div>
  </div>

  <div class="form-group">
    <label for="commencement_date">Commencement of tenancy</label>
    <input type="text" id="commencement_date" name="commencement_date" 
           placeholder="MM/DD/YYYY" required>
  </div>

  <h4>Applicant details</h4>

  <div class="form-group">
    <label for="full_name">Full Name</label>
    <input type="text" id="full_name" name="full_name" 
           placeholder="Full Name" required>
  </div>

  <div class="form-group">
    <label for="email">Email Address</label>
    <input type="email" id="email" name="email" 
           placeholder="Email Address" required>
  </div>

  <div class="form-group">
    <label for="phone">Phone Number</label>
    <input type="tel" id="phone" name="phone" 
           placeholder="Phone Number" required>
  </div>

  <div class="form-group">
    <label for="current_address">Current Address</label>
    <input type="text" id="current_address" name="current_address" 
           placeholder="Current Address" required>
  </div>

  <div class="form-group">
    <label>Employment Status</label>
    <div class="form-options">
      <label>
        <input type="radio" name="employment_status" value="employed"> Employed
      </label>
      <label>
        <input type="radio" name="employment_status" value="self-employed"> Self-employed
      </label>
      <label>
        <input type="radio" name="employment_status" value="unemployed"> Unemployed
      </label>
      <label>
        <input type="radio" name="employment_status" value="retired"> Retired
      </label>
    </div>
  </div>

  <div class="form-group">
    <label for="employer">Current Employer</label>
    <input type="text" id="employer" name="employer" 
           placeholder="Employer name (optional)">
  </div>

  <div class="form-group">
    <label for="income">Monthly Income</label>
    <input type="text" id="income" name="income" placeholder="$">
  </div>

  <div class="form-group">
    <label>Pets</label>
    <div class="form-options">
      <label>
        <input type="radio" name="pets" value="yes"> Yes
      </label>
      <label>
        <input type="radio" name="pets" value="no" checked> No
      </label>
    </div>
  </div>

  <div class="form-group">
    <label for="notes">Additional notes</label>
    <textarea id="notes" name="notes" rows="3" 
              placeholder="Any additional information..."></textarea>
  </div>

  <button type="submit" class="submit-btn">
    Submit Application
  </button>
</form>
CSS Styling for the tenant application form 
.tenant-form {
  max-width: 600px;
  margin: 0 auto;
  padding: 2rem;
  background: #0d0d0d;
  border: 1px solid #1a1a1a;
  border-radius: 12px;
  font-family: 'Outfit', sans-serif;
}

.tenant-form h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: #fafafa;
  margin-bottom: 0.5rem;
  letter-spacing: -0.02em;
}

.tenant-form .form-description {
  font-size: 0.9rem;
  color: #888888;
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

.tenant-form h4 {
  font-size: 1.1rem;
  font-weight: 600;
  color: #00ff88;
  margin: 1.5rem 0 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px dashed #2a2a2a;
}

.tenant-form h4:first-of-type {
  margin-top: 0;
}

.tenant-form .form-group {
  margin-bottom: 1.25rem;
}

.tenant-form label {
  display: block;
  font-size: 0.85rem;
  font-weight: 500;
  color: #e6edf3;
  margin-bottom: 0.35rem;
}

.tenant-form input[type="text"],
.tenant-form input[type="email"],
.tenant-form input[type="tel"],
.tenant-form select,
.tenant-form textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  margin: 0.5rem 0rem;
  background: #111111;
  border: 1px solid #1a1a1a;
  border-radius: 8px;
  color: #fafafa;
  font-size: 0.95rem;
  transition: all 0.2s ease;
}

.tenant-form input:focus,
.tenant-form select:focus,
.tenant-form textarea:focus {
  outline: none;
  border-color: #00ff88;
  box-shadow: 0 0 0 3px rgba(0, 255, 136, 0.15);
}

.tenant-form input::placeholder,
.tenant-form textarea::placeholder {
  color: #555555;
}

.tenant-form .form-row {
  display: flex;
  gap: 1rem;
  margin-top: 0.5rem;
}

.tenant-form .form-row .form-group {
  flex: 1;
  margin-bottom: 0;
}

.tenant-form .form-options {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 0.25rem;
}

.tenant-form .form-options label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.85rem;
  font-weight: normal;
  color: #888888;
  margin-bottom: 0;
  cursor: pointer;
}

.tenant-form .form-options input[type="radio"] {
  width: auto;
  margin-right: 0.25rem;
  accent-color: #00ff88;
}

.tenant-form textarea {
  resize: vertical;
  min-height: 80px;
  font-family: inherit;
}

.tenant-form .submit-btn {
  width: 100%;
  padding: 0.875rem 1.5rem;
  background: #00ff88;
  border: none;
  border-radius: 8px;
  color: #050505;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-top: 0.5rem;
}

.tenant-form .submit-btn:hover {
  background: #fafafa;
  transform: translateY(-1px);
  box-shadow: 0 4px 20px rgba(0, 255, 136, 0.15);
}

@media (max-width: 768px) {
  .tenant-form {
    padding: 1.5rem;
  }
  
  .tenant-form .form-row {
    flex-direction: column;
    gap: 0.5rem;
  }
  
  .tenant-form .form-options {
    flex-direction: column;
    gap: 0.5rem;
  }
}
Tailwind CSS Complete Tailwind version with CDN 
<!-- Add this to your <head> section -->
<script src="https://cdn.tailwindcss.com"></script>

<!-- Add this CSS for custom radio button color and form enhancements -->
<style>
    [type="radio"] {
        accent-color: #00ff88;
    }
    /* Optional: Smooth focus ring */
    input:focus, textarea:focus {
        outline: none;
        box-shadow: 0 0 0 3px rgba(0, 255, 136, 0.15);
    }
</style>

<!-- Tenant Application Form with Tailwind Classes -->
<form action="https://000form.com/f/your-endpoint" 
      method="POST" 
      class="max-w-2xl mx-auto p-8 bg-[#0d0d0d] border border-[#1a1a1a] rounded-xl font-['Outfit',sans-serif]">
  
  <h3 class="text-2xl font-semibold text-[#fafafa] mb-2 tracking-tight">
    Tenant Application Form
  </h3>
  
  <p class="text-sm text-[#888888] mb-6 leading-relaxed">
    Thank you for taking an interest in renting one of our properties. 
    Please fill in this form with the needed information.
  </p>

  <h4 class="text-lg font-semibold text-[#00ff88] mt-6 mb-4 pb-2 border-b border-dashed border-[#2a2a2a]">
    Tenancy details
  </h4>
  
  <!-- Property address -->
  <div class="mb-4">
    <label class="block text-sm font-medium text-[#e6edf3] mb-1">
      Property address
    </label>
    <input type="text" name="property_address" 
           placeholder="Street Address" 
           class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200 mb-2"
           required>
    <input type="text" name="property_address2" 
           placeholder="Street Address Line 2" 
           class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200">
  </div>

  <!-- City and Region -->
  <div class="flex flex-col sm:flex-row gap-4 mb-4">
    <div class="flex-1">
      <label class="block text-sm font-medium text-[#e6edf3] mb-1">City</label>
      <input type="text" name="city" placeholder="City" 
             class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200"
             required>
    </div>
    <div class="flex-1">
      <label class="block text-sm font-medium text-[#e6edf3] mb-1">Region</label>
      <input type="text" name="region" placeholder="Region" 
             class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200"
             required>
    </div>
  </div>

  <!-- Postal Code and Country -->
  <div class="flex flex-col sm:flex-row gap-4 mb-4">
    <div class="flex-1">
      <label class="block text-sm font-medium text-[#e6edf3] mb-1">Postal / Zip Code</label>
      <input type="text" name="postal_code" placeholder="Postal / Zip Code" 
             class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200"
             required>
    </div>
    <div class="flex-1">
      <label class="block text-sm font-medium text-[#e6edf3] mb-1">Country</label>
      <input type="text" name="country" value="USA" 
             class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200">
    </div>
  </div>

  <!-- Commencement Date -->
  <div class="mb-4">
    <label class="block text-sm font-medium text-[#e6edf3] mb-1">
      Commencement of tenancy
    </label>
    <input type="text" name="commencement_date" 
           placeholder="MM/DD/YYYY" 
           class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200"
           required>
  </div>

  <h4 class="text-lg font-semibold text-[#00ff88] mt-6 mb-4 pb-2 border-b border-dashed border-[#2a2a2a]">
    Applicant details
  </h4>

  <!-- Applicant fields -->
  <div class="space-y-3 mb-4">
    <input type="text" name="full_name" placeholder="Full Name" 
           class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200"
           required>
    <input type="email" name="email" placeholder="Email Address" 
           class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200"
           required>
    <input type="tel" name="phone" placeholder="Phone Number" 
           class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200"
           required>
    <input type="text" name="current_address" placeholder="Current Address" 
           class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200"
           required>
  </div>

  <!-- Employment Status -->
  <div class="mb-4">
    <label class="block text-sm font-medium text-[#e6edf3] mb-2">
      Employment Status
    </label>
    <div class="flex flex-wrap gap-4">
      <label class="inline-flex items-center gap-2 text-sm text-[#888888] hover:text-[#fafafa] transition-colors cursor-pointer">
        <input type="radio" name="employment_status" value="employed" class="w-4 h-4"> Employed
      </label>
      <label class="inline-flex items-center gap-2 text-sm text-[#888888] hover:text-[#fafafa] transition-colors cursor-pointer">
        <input type="radio" name="employment_status" value="self-employed" class="w-4 h-4"> Self-employed
      </label>
      <label class="inline-flex items-center gap-2 text-sm text-[#888888] hover:text-[#fafafa] transition-colors cursor-pointer">
        <input type="radio" name="employment_status" value="unemployed" class="w-4 h-4"> Unemployed
      </label>
      <label class="inline-flex items-center gap-2 text-sm text-[#888888] hover:text-[#fafafa] transition-colors cursor-pointer">
        <input type="radio" name="employment_status" value="retired" class="w-4 h-4"> Retired
      </label>
    </div>
  </div>

  <!-- Employer and Income -->
  <div class="flex flex-col sm:flex-row gap-4 mb-4">
    <div class="flex-1">
      <label class="block text-sm font-medium text-[#e6edf3] mb-1">Current Employer</label>
      <input type="text" name="employer" placeholder="Employer name (optional)" 
             class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200">
    </div>
    <div class="flex-1">
      <label class="block text-sm font-medium text-[#e6edf3] mb-1">Monthly Income</label>
      <input type="text" name="income" placeholder="$" 
             class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200">
    </div>
  </div>

  <!-- Pets -->
  <div class="mb-4">
    <label class="block text-sm font-medium text-[#e6edf3] mb-2">Pets</label>
    <div class="flex gap-4">
      <label class="inline-flex items-center gap-2 text-sm text-[#888888] hover:text-[#fafafa] transition-colors cursor-pointer">
        <input type="radio" name="pets" value="yes" class="w-4 h-4"> Yes
      </label>
      <label class="inline-flex items-center gap-2 text-sm text-[#888888] hover:text-[#fafafa] transition-colors cursor-pointer">
        <input type="radio" name="pets" value="no" checked class="w-4 h-4"> No
      </label>
    </div>
  </div>

  <!-- Additional Notes -->
  <div class="mb-6">
    <label class="block text-sm font-medium text-[#e6edf3] mb-1">
      Additional notes
    </label>
    <textarea name="notes" rows="3" 
              class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] focus:ring-0 transition-all duration-200 resize-y"
              placeholder="Any additional information..."></textarea>
  </div>

  <button type="submit" 
          class="w-full py-3 px-6 bg-[#00ff88] text-[#050505] font-semibold rounded-lg hover:bg-white transition-all duration-200 hover:-translate-y-0.5 hover:shadow-lg hover:shadow-[#00ff88]/20">
    Submit Application
  </button>
</form>

How to use this form

  1. Copy the HTML code and paste it into your website where you want the form to appear.
  2. Copy the CSS code and add it to your stylesheet, or use the Tailwind version if you're using Tailwind CSS.
  3. Replace your-endpoint in the form action with your actual 000form endpoint URL.
  4. That's it! Your form will start receiving submissions directly to your inbox.

Related Application Forms

Job Application Form

Minimal job application form

View form →

Rental Application Form

Property rental application

View form →

Vendor Application Form

Supplier registration form

View form →