0
X
Add Snippet To Project
New Project
Add To Existing Project
<!-- HOMEPAGE.HTML - OXIL MODERN PREFAB LIVING -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Oxil - Modern Prefab Living</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: Arial, sans-serif; line-height: 1.6; color: #333; }
header { background: #002e5c; color: white; padding: 20px; text-align: center; }
header h1 { font-size: 32px; }
.hero { background: linear-gradient(135deg, #002e5c, #004a8f); color: white; padding: 80px 20px; text-align: center; }
.hero h2 { font-size: 48px; margin: 15px 0; }
.cta-buttons { display: flex; gap: 15px; justify-content: center; margin-top: 30px; flex-wrap: wrap; }
.btn { padding: 12px 30px; font-size: 16px; border: none; border-radius: 5px; cursor: pointer; }
.btn-primary { background: #ffd700; color: #002e5c; font-weight: bold; }
.btn-secondary { background: white; color: #002e5c; }
.highlights { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; padding: 60px 20px; background: #f9f9f9; }
.highlight-box { background: white; padding: 30px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
.highlight-box h3 { color: #002e5c; margin-bottom: 10px; }
.section { padding: 60px 20px; max-width: 1200px; margin: 0 auto; }
nav { background: #002e5c; padding: 15px; text-align: center; }
nav a { color: white; text-decoration: none; margin: 0 20px; font-weight: bold; }
footer { background: #002e5c; color: white; text-align: center; padding: 30px; }
</style>
</head>
<body>
<header>
<h1>OXIL</h1>
<p>Modern Prefabricated Modular Homes & Commercial Buildings</p>
</header>
<nav>
<a href="#home">Home</a>
<a href="about.html">About</a>
<a href="residential.html">Residential</a>
<a href="commercial.html">Commercial</a>
<a href="partnership.html">Partnership</a>
<a href="contact.html">Contact</a>
</nav>
<section class="hero">
<h2>Modern Prefab Living.</h2>
<h2>Fast. Beautiful. Built to Last.</h2>
<p>Oxil designs, manufactures, and deploys premium prefabricated modular homes and commercial cabins engineered for comfort, speed, and scalability.</p>
<div class="cta-buttons">
<button class="btn btn-primary">Explore Models</button>
<button class="btn btn-secondary">Start a Project</button>
<button class="btn btn-secondary">Partner with Oxil</button>
</div>
</section>
<section class="highlights">
<div class="highlight-box">
<h3>Precision Prefab</h3>
<p>Factory-built quality and consistency</p>
</div>
<div class="highlight-box">
<h3>Rapid Deployment</h3>
<p>Buildings install in days, not months</p>
</div>
<div class="highlight-box">
<h3>Energy Efficient</h3>
<p>Solar-ready, low-VOC finishes</p>
</div>
<div class="highlight-box">
<h3>Relocatable</h3>
<p>Designed for de-install and redeployment</p>
</div>
</section>
<section class="section">
<h2>Why Choose Oxil?</h2>
<p>Oxil is an integrated design-build company focused on prefabricated modular homes and commercial structures. We bring factory precision to construction, delivering high-quality, relocatable cabins and multi-module buildings that install in days, not months.</p>
</section>
<footer>
<p>© 2025 Oxil. All rights reserved. | Contact: info@oxil.com</p>
</footer>
</body>
</html>
Complete HTML homepage for Oxil prefabricated modular homes website with hero section, highlights, and call-to-action buttons