Modern Responsive Sign-Up Page with Clean UI

A fully responsive sign-up page designed to impress users and boost conversions. Built with HTML5 & CSS3 it’s fast, lightweight, and SEO-friendly.

folder(GitHub) : Click here
Website(Live) : Click here

Features

• Minimal & Modern Design – Eye-catching split layout with background image.
• Fully Responsive – Mobile, tablet, and desktop friendly.
• User-Friendly Inputs – First name, last name, email, password, and terms checkbox.
• SEO-Optimized – Clean, semantic HTML structure for better Google ranking.
• Lightweight & Fast Loading – No heavy frameworks.
• Social Login Buttons – Continue with Google or Apple.

Tech Stack

• HTML5 → Semantic markup for SEO & accessibility.
• CSS3 → Modern layouts with Flexbox & responsive design.

📂 Folder Structure

project-folder/
│── index.html
│── style.css
│── /images
│     └── background.jpg
│── README.md

index.html

    <div class="container">              
        <div class="page signup-page" id="signupPage">
            <div class="signup-container">
                <div class="signup-left">
                    <div class="left-content">
                        <h2 class="left-title">Create your Account</h2>
                        <p class="left-subtitle">Share your artwork and Get projects!</p>
                    </div>
                </div>

                <div class="signup-right">
                    <h2 class="signup-title">Sign Up</h2>

                    <div class="form-group">
                        <input type="text" placeholder="First name" class="signup-input">
                    </div>

                    <div class="form-group">
                        <input type="text" placeholder="Last name" class="signup-input">
                    </div>

                    <div class="form-group">
                        <input type="email" placeholder="Email address" class="signup-input">
                    </div>

                    <div class="form-group">
                        <input type="password" placeholder="Password" class="signup-input">
                    </div>

                    <div class="checkbox-group">
                        <label class="checkbox-label">
                            <input type="checkbox" class="checkbox-input">
                            <span class="checkmark"></span>
                            Accept Terms & Conditions
                        </label>
                    </div>

                    <button class="primary-button">Join us →</button>

                    <div class="divider">
                        <span class="divider-text">or</span>
                    </div>



                    <button class="google-button">
                        <img src="https://img.icons8.com/ios-glyphs/30/google-logo--v1.png" alt="google"
                            class="button-icon">
                        Continue with Google
                    </button>

                    <button class="apple-button">
                        <img width="50" height="50" src="https://img.icons8.com/ios-filled/50/FFFFFF/mac-os.png"
                            alt="apple" class="button-icon">
                        Continue with Apple
                    </button>

                    <p class="switch-text">Already have an account? <a href="#">Log in</a></p>
                </div>
            </div>
        </div>
    </div>

for Complete folder(GitHub) : Click here