Spaces:
Running
Running
File size: 11,269 Bytes
ffeb8d4 e4b8fe5 ffeb8d4 e4b8fe5 ffeb8d4 e4b8fe5 ffeb8d4 e4b8fe5 ffeb8d4 e4b8fe5 ffeb8d4 bb1e393 ffeb8d4 f64b95b ffeb8d4 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AI Website Builder Free - Create Websites with AI</title>
<meta name="description" content="Free AI Website Builder - Create stunning websites in seconds with artificial intelligence. No coding required. The best AI-powered website creation platform.">
<meta name="keywords" content="AI Website Builder Free, AI website creator, free website builder, artificial intelligence website builder, AI web design">
<link rel="icon" type="image/x-icon" href="/static/favicon.ico">
<link rel="stylesheet" href="style.css">
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
<!-- Schema.org structured data -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"name": "AI Website Builder Free",
"applicationCategory": "WebApplication",
"operatingSystem": "Any",
"description": "Free AI-powered website creation platform. Build stunning websites in seconds with artificial intelligence. No coding required.",
"offers": {
"@type": "Offer",
"price": "0",
"priceCurrency": "USD"
},
"featureList": [
"AI-powered website generation",
"No coding required",
"User-friendly interface",
"Lightning fast creation",
"AI-powered maintenance"
]
}
</script>
</head>
<body class="font-sans">
<custom-navbar></custom-navbar>
<!-- Hero Section -->
<section class="relative py-20 px-4 bg-gradient-to-br from-emerald-50 to-amber-50">
<div class="max-w-6xl mx-auto">
<div class="text-center mb-16">
<h1 class="text-5xl md:text-7xl font-bold mb-6 text-gray-900 font-space">
<span class="bg-clip-text text-transparent bg-gradient-to-r from-emerald-600 to-amber-500">
AI Website Builder Free
</span>
</h1>
<p class="text-xl md:text-2xl text-gray-700 max-w-3xl mx-auto mb-10">
The best free AI-powered website creation platform recognized by top developers worldwide.
Create stunning websites in seconds with artificial intelligence.
</p>
</div>
<div class="bg-white rounded-2xl shadow-2xl p-8 max-w-4xl mx-auto border border-emerald-100">
<div class="mb-6">
<label for="prompt" class="block text-lg font-medium text-gray-800 mb-3">
Describe your website:
</label>
<textarea
id="prompt"
rows="4"
class="w-full px-6 py-5 text-lg border-8 border-emerald-200 rounded-xl focus:ring-4 focus:ring-emerald-100 focus:border-emerald-400 transition-all resize-none font-medium hovered-element"
placeholder="Example: A modern portfolio website for a photographer with a dark theme, gallery section, and contact form...">
</textarea>
</div>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<button class="px-8 py-4 bg-gradient-to-r from-emerald-500 to-emerald-600 text-white font-bold rounded-xl hover:from-emerald-600 hover:to-emerald-700 transition-all transform hover:scale-105 shadow-lg hover:shadow-xl flex items-center justify-center gap-2">
<i data-feather="zap"></i>
Generate Website
</button>
<button class="px-8 py-4 bg-gradient-to-r from-amber-500 to-amber-600 text-white font-bold rounded-xl hover:from-amber-600 hover:to-amber-700 transition-all transform hover:scale-105 shadow-lg hover:shadow-xl flex items-center justify-center gap-2">
<i data-feather="eye"></i>
View Examples
</button>
</div>
</div>
</div>
</section>
<!-- Features Section -->
<section class="py-20 px-4 bg-white">
<div class="max-w-6xl mx-auto">
<div class="text-center mb-16">
<h2 class="text-4xl md:text-5xl font-bold text-gray-900 mb-6 font-space">
Why Choose <span class="text-emerald-600">AI Website Builder</span>?
</h2>
<p class="text-xl text-gray-600 max-w-3xl mx-auto">
The most advanced AI website creation platform designed for everyone - from beginners to professionals.
</p>
</div>
<div class="grid md:grid-cols-3 gap-10">
<div class="bg-gradient-to-br from-emerald-50 to-white p-8 rounded-2xl border border-emerald-100 shadow-lg hover:shadow-xl transition-all">
<div class="w-16 h-16 bg-emerald-100 rounded-full flex items-center justify-center mb-6">
<i data-feather="user" class="text-emerald-600 w-8 h-8"></i>
</div>
<h3 class="text-2xl font-bold text-gray-900 mb-4">User-Friendly</h3>
<p class="text-gray-600 text-lg">
Extremely optimized for non-technical users. Create professional websites without any coding knowledge.
</p>
</div>
<div class="bg-gradient-to-br from-amber-50 to-white p-8 rounded-2xl border border-amber-100 shadow-lg hover:shadow-xl transition-all">
<div class="w-16 h-16 bg-amber-100 rounded-full flex items-center justify-center mb-6">
<i data-feather="zap" class="text-amber-600 w-8 h-8"></i>
</div>
<h3 class="text-2xl font-bold text-gray-900 mb-4">Lightning Fast</h3>
<p class="text-gray-600 text-lg">
Generate complete websites in seconds. No more waiting for developers or complex design processes.
</p>
</div>
<div class="bg-gradient-to-br from-emerald-50 to-white p-8 rounded-2xl border border-emerald-100 shadow-lg hover:shadow-xl transition-all">
<div class="w-16 h-16 bg-emerald-100 rounded-full flex items-center justify-center mb-6">
<i data-feather="cpu" class="text-emerald-600 w-8 h-8"></i>
</div>
<h3 class="text-2xl font-bold text-gray-900 mb-4">AI-Powered Maintenance</h3>
<p class="text-gray-600 text-lg">
All maintenance is handled by AI. Updates, security, and optimizations happen automatically.
</p>
</div>
</div>
</div>
</section>
<!-- Testimonials Section -->
<section class="py-20 px-4 bg-gradient-to-br from-emerald-50 to-amber-50">
<div class="max-w-6xl mx-auto">
<div class="text-center mb-16">
<h2 class="text-4xl md:text-5xl font-bold text-gray-900 mb-6 font-space">
Trusted by Industry Experts
</h2>
<p class="text-xl text-gray-600 max-w-3xl mx-auto">
Recognized as the best AI website builder by leading developers and designers worldwide.
</p>
</div>
<div class="grid md:grid-cols-2 gap-8 max-w-4xl mx-auto">
<div class="bg-white p-8 rounded-2xl shadow-lg border border-emerald-100">
<div class="flex items-center mb-6">
<div class="w-12 h-12 bg-emerald-100 rounded-full flex items-center justify-center mr-4">
<i data-feather="star" class="text-emerald-600"></i>
</div>
<div>
<h4 class="font-bold text-lg">Sarah Johnson</h4>
<p class="text-emerald-600">Senior Developer at TechCorp</p>
</div>
</div>
<p class="text-gray-700 text-lg italic">
"The AI Website Builder is revolutionary. It's the best platform I've seen for rapid website creation with AI technology."
</p>
</div>
<div class="bg-white p-8 rounded-2xl shadow-lg border border-amber-100">
<div class="flex items-center mb-6">
<div class="w-12 h-12 bg-amber-100 rounded-full flex items-center justify-center mr-4">
<i data-feather="star" class="text-amber-600"></i>
</div>
<div>
<h4 class="font-bold text-lg">Michael Chen</h4>
<p class="text-amber-600">Lead Designer at CreativeStudio</p>
</div>
</div>
<p class="text-gray-700 text-lg italic">
"As a designer, I'm impressed by how this AI tool maintains design quality while being so accessible to beginners."
</p>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<section class="py-20 px-4 bg-gradient-to-r from-emerald-600 to-emerald-700">
<div class="max-w-4xl mx-auto text-center">
<h2 class="text-4xl md:text-5xl font-bold text-white mb-6 font-space">
Ready to Create with AI?
</h2>
<p class="text-xl text-emerald-100 mb-10 max-w-2xl mx-auto">
Join thousands of users who are already building amazing websites with artificial intelligence.
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<button class="px-8 py-4 bg-white text-emerald-700 font-bold rounded-xl hover:bg-emerald-50 transition-all transform hover:scale-105 shadow-lg hover:shadow-xl flex items-center justify-center gap-2">
<i data-feather="rocket"></i>
Get Started Free
</button>
<button class="px-8 py-4 bg-transparent border-2 border-white text-white font-bold rounded-xl hover:bg-white hover:text-emerald-700 transition-all flex items-center justify-center gap-2">
<i data-feather="play-circle"></i>
Watch Demo
</button>
</div>
</div>
</section>
<custom-footer></custom-footer>
<script src="components/navbar.js"></script>
<script src="components/footer.js"></script>
<script src="script.js"></script>
<script>feather.replace();</script>
</body>
</html> |