Register your business as a vendor or supplier for our company.
Copy and paste this code into your website. Don't forget to replace your-endpoint with your actual 000form endpoint URL.
<form action="https://000form.com/f/your-endpoint" method="POST" class="vendor-form">
<h3>Vendor Application Form</h3>
<p class="form-description">
Register your business as a vendor or supplier for our company.
</p>
<h4>Company information</h4>
<div class="form-group">
<label for="company_name">Company Name:</label>
<input type="text" id="company_name" name="company_name"
placeholder="Enter your company name" required>
</div>
<div class="form-group">
<label for="business_type">Business Type:</label>
<select id="business_type" name="business_type" required>
<option value="">Select business type</option>
<option value="sole-proprietorship">Sole Proprietorship</option>
<option value="partnership">Partnership</option>
<option value="llc">LLC</option>
<option value="corporation">Corporation</option>
<option value="non-profit">Non-Profit</option>
</select>
</div>
<div class="form-group">
<label for="tax_id">Tax ID / EIN:</label>
<input type="text" id="tax_id" name="tax_id"
placeholder="XX-XXXXXXX" required>
</div>
<h4>Contact person</h4>
<div class="form-group">
<label for="contact_name">Full Name:</label>
<input type="text" id="contact_name" name="contact_name"
placeholder="Enter contact name" required>
</div>
<div class="form-group">
<label for="contact_email">Email:</label>
<input type="email" id="contact_email" name="contact_email"
placeholder="Enter email address" required>
</div>
<div class="form-group">
<label for="contact_phone">Phone:</label>
<input type="tel" id="contact_phone" name="contact_phone"
placeholder="Enter phone number" required>
</div>
<h4>Business address</h4>
<div class="form-group">
<label for="street_address">Street Address:</label>
<input type="text" id="street_address" name="street_address"
placeholder="Street address" required>
</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="state">State:</label>
<input type="text" id="state" name="state" placeholder="State" required>
</div>
</div>
<div class="form-row">
<div class="form-group">
<label for="zip">ZIP Code:</label>
<input type="text" id="zip" name="zip" placeholder="ZIP Code" required>
</div>
<div class="form-group">
<label for="country">Country:</label>
<input type="text" id="country" name="country"
placeholder="USA" value="USA">
</div>
</div>
<button type="submit" class="submit-btn">Submit Vendor Application</button>
</form>
.vendor-form {
max-width: 600px;
margin: 0 auto;
padding: 2rem;
background: #0d0d0d;
border: 1px solid #1a1a1a;
border-radius: 12px;
font-family: 'Outfit', sans-serif;
}
.vendor-form h3 {
font-size: 1.5rem;
font-weight: 600;
color: #fafafa;
margin-bottom: 0.5rem;
letter-spacing: -0.02em;
}
.vendor-form .form-description {
font-size: 0.9rem;
color: #888888;
margin-bottom: 1.5rem;
line-height: 1.6;
}
.vendor-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;
}
.vendor-form h4:first-of-type {
margin-top: 0;
}
.vendor-form .form-group {
margin-bottom: 1.25rem;
}
.vendor-form label {
display: block;
font-size: 0.85rem;
font-weight: 600;
color: #e6edf3;
margin-bottom: 0.5rem;
}
.vendor-form input[type="text"],
.vendor-form input[type="email"],
.vendor-form input[type="tel"],
.vendor-form select {
width: 100%;
padding: 0.75rem 1rem;
background: #111111;
border: 1px solid #1a1a1a;
border-radius: 8px;
color: #fafafa;
font-size: 0.95rem;
transition: all 0.2s ease;
}
.vendor-form input:focus,
.vendor-form select:focus {
outline: none;
border-color: #00ff88;
box-shadow: 0 0 0 3px rgba(0, 255, 136, 0.15);
}
.vendor-form input::placeholder {
color: #555555;
}
.vendor-form select {
cursor: pointer;
}
.vendor-form .form-row {
display: flex;
gap: 1rem;
margin-top: 0.5rem;
}
.vendor-form .form-row .form-group {
flex: 1;
margin-bottom: 0;
}
.vendor-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;
}
.vendor-form .submit-btn:hover {
background: #fafafa;
transform: translateY(-1px);
box-shadow: 0 4px 20px rgba(0, 255, 136, 0.15);
}
@media (max-width: 768px) {
.vendor-form {
padding: 1.5rem;
}
.vendor-form .form-row {
flex-direction: column;
gap: 0.5rem;
}
}
<!-- Add Tailwind CSS CDN to your <head> -->
<script src="https://cdn.tailwindcss.com"></script>
<!-- HTML with Tailwind Classes -->
<form action="https://000form.com/f/your-endpoint"
method="POST"
class="vendor-form-container max-w-2xl mx-auto p-8 bg-[#0d0d0d] border border-[#1a1a1a] rounded-xl">
<h3 class="text-2xl font-semibold text-[#fafafa] mb-2 tracking-tight">
Vendor Application Form
</h3>
<p class="text-sm text-[#888888] mb-6 leading-relaxed">
Register your business as a vendor or supplier for our company.
</p>
<h4 class="text-lg font-semibold text-[#00ff88] mb-4 pb-2 border-b border-dashed border-[#2a2a2a]">
Company information
</h4>
<div class="mb-5">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">Company Name:</label>
<input type="text" name="company_name"
placeholder="Enter your company name"
class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] transition-all"
required>
</div>
<div class="mb-5">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">Business Type:</label>
<select name="business_type"
class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] focus:border-[#00ff88] transition-all cursor-pointer"
required>
<option value="">Select business type</option>
<option value="sole-proprietorship">Sole Proprietorship</option>
<option value="partnership">Partnership</option>
<option value="llc">LLC</option>
<option value="corporation">Corporation</option>
<option value="non-profit">Non-Profit</option>
</select>
</div>
<div class="mb-5">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">Tax ID / EIN:</label>
<input type="text" name="tax_id"
placeholder="XX-XXXXXXX"
class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] transition-all"
required>
</div>
<h4 class="text-lg font-semibold text-[#00ff88] mt-6 mb-4 pb-2 border-b border-dashed border-[#2a2a2a]">
Contact person
</h4>
<div class="mb-5">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">Full Name:</label>
<input type="text" name="contact_name"
placeholder="Enter contact name"
class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] transition-all"
required>
</div>
<div class="mb-5">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">Email:</label>
<input type="email" name="contact_email"
placeholder="Enter email address"
class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] transition-all"
required>
</div>
<div class="mb-5">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">Phone:</label>
<input type="tel" name="contact_phone"
placeholder="Enter phone number"
class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] transition-all"
required>
</div>
<h4 class="text-lg font-semibold text-[#00ff88] mt-6 mb-4 pb-2 border-b border-dashed border-[#2a2a2a]">
Business address
</h4>
<div class="mb-5">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">Street Address:</label>
<input type="text" name="street_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] transition-all"
required>
</div>
<div class="flex flex-col sm:flex-row gap-4 mb-5 mt-2">
<div class="flex-1">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">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] transition-all"
required>
</div>
<div class="flex-1">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">State:</label>
<input type="text" name="state" placeholder="State"
class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] transition-all"
required>
</div>
</div>
<div class="flex flex-col sm:flex-row gap-4 mb-6 mt-2">
<div class="flex-1">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">ZIP Code:</label>
<input type="text" name="zip" placeholder="ZIP Code"
class="w-full px-4 py-3 bg-[#111111] border border-[#1a1a1a] rounded-lg text-[#fafafa] placeholder-[#555555] focus:border-[#00ff88] transition-all"
required>
</div>
<div class="flex-1">
<label class="block text-sm font-semibold text-[#e6edf3] mb-2">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] transition-all">
</div>
</div>
<button type="submit"
class="w-full py-3 px-6 bg-[#00ff88] text-[#050505] font-semibold rounded-lg hover:bg-white transition-all hover:-translate-y-0.5 hover:shadow-lg hover:shadow-[#00ff88]/20">
Submit Vendor Application
</button>
</form>
your-endpoint in the form action with your actual 000form endpoint URL.