Header
Hero
About
Services
Contact
Footer
Sidebar
Navbar
Breadcrumb
Breadcrumb Advanced
Mega Menu
Card
Gallery
Team
Testimonials
Stats
Timeline
Faq
Contact
Login Form
Newsletter
Search Bar
Toggle Switch
Modal
Progress
Pricing
Primary Button
Secondary Button
Button Group
React Counter
Readme Basic
Readme Advanced
Seo
Seo Schema
Social Icons
Feature Icons
Font Icons
HTMLHTML5
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
<div style="display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 100vh; padding: 3rem 2rem; background: #f3f4f6; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;"> <div style="max-width: 600px; text-align: center;"> <div style="display: flex; align-items: center; justify-content: center; gap: 1rem; margin-bottom: 2rem;"> <div style="width: 64px; height: 64px; background: linear-gradient(135deg, #1f2937 0%, #374151 50%, #4b5563 100%); border-radius: 16px; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 32px rgba(0,0,0,0.1);"> <svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="#f3f4f6" stroke-width="2"> <path d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4"/> </svg> </div> <h1 style="font-size: 3rem; font-weight: 800; margin: 0; letter-spacing: -0.02em; background: linear-gradient(135deg, #1f2937 0%, #374151 33%, #4b5563 66%, #6b7280 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;"> Your Website </h1> </div> <p style="font-size: 1.5rem; margin-bottom: 3rem; line-height: 1.5; background: linear-gradient(135deg, #4b5563 0%, #6b7280 33%, #9ca3af 66%, #d1d5db 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;"> Publish your project with ready made components and the AI-powered builder. </p> <button onclick="alert('Start building amazing websites!')" style="background: linear-gradient(135deg, #1f2937 0%, #374151 50%, #4b5563 100%); color: white; border: none; padding: 16px 48px; font-size: 1.125rem; font-weight: 600; border-radius: 12px; cursor: pointer; box-shadow: 0 8px 24px rgba(0,0,0,0.15); transition: transform 0.2s, box-shadow 0.2s;"> Get Started </button> <div style="display: flex; gap: 4rem; justify-content: center; margin-top: 4rem; padding-top: 3rem; border-top: 1px solid #d1d5db;"> <div> <div style="font-size: 2rem; font-weight: 700; margin-bottom: 0.5rem; background: linear-gradient(135deg, #1f2937 0%, #374151 50%, #4b5563 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;">50+</div> <div style="font-size: 0.875rem; background: linear-gradient(135deg, #6b7280 0%, #9ca3af 50%, #d1d5db 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;">Components</div> </div> <div> <div style="font-size: 2rem; font-weight: 700; margin-bottom: 0.5rem; background: linear-gradient(135deg, #1f2937 0%, #374151 50%, #4b5563 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;">AI</div> <div style="font-size: 0.875rem; background: linear-gradient(135deg, #6b7280 0%, #9ca3af 50%, #d1d5db 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;">Powered</div> </div> <div> <div style="font-size: 2rem; font-weight: 700; margin-bottom: 0.5rem; background: linear-gradient(135deg, #1f2937 0%, #374151 50%, #4b5563 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;">100%</div> <div style="font-size: 0.875rem; background: linear-gradient(135deg, #6b7280 0%, #9ca3af 50%, #d1d5db 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;">Free</div> </div> </div> </div> </div>
38 lines
3590 characters
HTML