0% found this document useful (0 votes)

89 views

Amazon Clone App

Uploaded by

nitinkewat21

We take content rights seriously. If you suspect this is your content, claim it here.

Available Formats

Download as PDF, TXT or read online on Scribd

0% found this document useful (0 votes)

89 views

Amazon Clone App

Uploaded by

nitinkewat21

We take content rights seriously. If you suspect this is your content, claim it here.

Available Formats

Download as PDF, TXT or read online on Scribd

You are on page 1/ 67

A

MAJOR PROJECT
(BASED ON PAPER BCA-601)
ON
AMAZON CLONE APP

BY
RUPESH KUMAR SAH
AVINASH KUMAR TIWARI
ABHISHEK KUMAR
SRINIWAS RANJAN
(Bachelor of Computer Application)
6th SEMESTER

Under the Guidance of

Prabhat Kumar
(BCA Department L.N.D College Motihari)

……………………… 1
Signature
CANDIDATE’S DECLARATION

I hereby declare that the major project work being presented in this report
entitled ‘’Amazon Clone’’ submitted in the department of BACHELOR OF
COMPUTER APPLICATION (VOCATIONAL COURSE), Faculty of BCA L.N.D
COLLEGE MOTIHARI is the authentic work carried out by me Under the
guidance of Prabhat Kumar Department of BCA L.N.D COLLEGE Motihari

Date- 22/12/2023

RUPESH KUMAR SAH

REG-20CCVGCS038/20
ROLL-214155

AVINASH KUMAR TIWARI ABHISHEK KUMAR SRINIWAS RANJAN

REG-20CCVGCS009/20 REG-20CCVGCS021/20 REG-20CCVGCS017/20
ROLL-214128 ROLL- 214138 ROLL-214134

(BACHELOR OF COMPUTER APPLICATION)

6th SEMESTER
L.N.D COLLEGE MOTIHARI

2
ACKNOWLEDGEMENT

I would like to express my special thanks of gratitude to my teacher Prabhat

Kumar who gave me the golden opportunity to do this wonderful project on the

topic of Amazon Clone, which also helped me in doing a lot of research and I
came to know about so many new things I am really thankful to them

Secondly I would also like to thank my friends who helped me a lot in finalizing
this project within the limited time frame.

3
1. Title of the project:
• Amazon Clone

2. Objective of the project:

• The main objective of this project is to selling of product through
online. And this website is very interactive to the users.

3. Language Used
• HTML, CSS

Table of the Content

SNO. Description Page. No
1. Introduction 5
2. What is an Amazon Clone App? 5

3. Salient Features of the Amazon Clone App 6-10

4. Overview 11
5 Technology Used 11
6 Description of Technology 11-12

7 System Design 13
8 ER-Diagram 14

4
Amazon Clone

Introduction

An Amazon clone app is a mobile application that replicates the functionality

and features of the popular e-commerce platform, Amazon. It allows users to
browse and purchase products, track orders, leave reviews, and more, just like
on the original Amazon website.

Amazon clone script provides descriptions and images, search and filter options,
shopping carts, secure payment gateways, and order management systems to
keep your business high-end. With advanced features and convenient online
shopping experiences, Amazon's clone website is positioned for entrepreneurs
to flock to it.

What is an Amazon Clone App?

It is a white-label, feature-oriented e-commerce App that can be launched at
any time as per the requirement. Armed with a series of details like the easy
and fast process of ordering and checking out multiple payment gateways
and multi-vendor outlets, it is one of the fascinating apps among its
competitors.

Being one of the best app developers, we provide a top-notch clone app that
can be completely customizable as per the client’s needs. With features like live
tracking & multi-currency integration, our Amazon Clone App provides you with
a worldwide platform and clients and customers from a global destination.

5
Salient Features of the Amazon Clone App

We at WebRock Media offer the best Amazon clone app development services so that you
and your customers can utilize the app and enjoy its rich features. Provide the following
features for our ready to launch Amazon clone app, such as

Advanced Navigation Bar:

A website is incomplete without a navigation bar because it is the easiest way to get hold of
the product or service that a consumer is looking for. Browsing through the categories to
get your desired products is time taking & sometimes & even a Lot of people are unaware
of it. So, a search bar is essential to let the customer feel comfortable.

Well Defined Homepage:

A home page is the first thing a customer notices, so creating a compelling homepage that
will greet your customer with positivity is one of the essential parts of homepage design.
We emphasize creating an aesthetically pleasing website homepage with the latest
multimedia inputs.

By landing at the homepage, a customer will get to know about the latest offers, deals,
discounts, or any ongoing campaigns. Furthermore, information about new arrivals, FAQs,
and exhilarating videos is available.

In-App Chat Facility:

These features make the process easier for your customers. Whenever a customer lands on
your website, a pop-up will be available for in-app chat. On clicking that, they will be able to
chat with a customer care representative to address any query.

Most of the time, the artificial intelligence facility is available in the 24hr chat process to
assist your customer. This way, a customer feels more connected and assured whenever
they land on your website or App

6
AR View:
A lot of time, consumers feel slightly skeptical about purchasing a product online. Especially
when they are searching for a retail product like fashion garments or shoes, the biggest
concern they face is the lack of the trial facility that a physical store offers.

Now you can offer them a virtual trial facility with the advanced AR view technique and get
ready to shatter all the constraints that online retail may face. This facility also overcomes
any misconceptions associated with online shopping.

Advanced Shopping Cart:

This feature lets your customer easily purchase the necessary goods. A shopping cart makes
the process of checkout seamless and hassle-free. Your customer can add as many products
as possible and go to check out. No need to stand in a queue for hours before checking out.

Furthermore, the checkout feature stores and displays all the vital details like the total cart
value, when the product will be delivered, if there is any shipping charge associated, and
other vital details of each product like weight and quantity. This enables a customer to get
all the details before making a payment.

Wish List:
Online marketplace like Amazon clone is like an ocean that can give you access to more
than 10000+ products in various price ranges. So, while browsing through these product
lists, your consumer might like several products they might purchase later. Wishlist features
enable them to store these products safely in a particular location which they can access
later.

We provide the most advanced wish list feature, which will notify you of the status of a
saved product from time to time. So, whether it is within the stick or not, if there are any
changes in the displayed price or quantity, everything is notified to your customer through
messages. This wishlist option is very useful as a customer can create a checklist point that
can be accessed anytime.

On-time Tracking:
One of the biggest hurdles consumers face is to wait for their products until they get
delivered. Even the anxiety intensifies when the payment is already made. And that is why
to ensure customer satisfaction, we offer real-time tracking, due to which a customer can
track their package and get to see the development from time to time.

7
Necessary details like dispatching time, delivery status, and delivery person contact details
are all mentioned along with the tracking details. Moreover, the live location updates of
their products make them assured and gain more trust.

Language Support:
Amazon is a global platform, and customers across different time zones access it to get
their desired product. Therefore, Amazon clone development should be done by keeping in
mind the global consumers, and that is why we offer multilingual support by including the
world’s major languages. This enables users across the globe to access your app more
conveniently and feel personally attached to it.

Sharing on Social Media:

The impact of social media is now very prominent in our daily life, and social media
marketing is surging rapidly. We offer robust social media sharing options through which
your customers can share their favourite products on their respective social handles. This
will boost your social marketing strategies to a new level.

Reviews & Ratings:

Give your customer the freedom to express their experience in the review section. Here
they can write about their experience, whether good or bad while purchasing hoods from
your App. Rating options are also available, and a consumer can rate your service.

Reviews & ratings give personalized feelings, and customers get more attached to your app.
Moreover, a new customer will always go through the reviews to get to know the working
principle of your app.

Multi payment option:

Gone are those days when you can only pay through cash once after you receive the
product. Now an Amazon clone app is equipped with a multiple payment option facility.
You can pay through a debit card or credit card, even though there is UPI at your check out.

This will keep your delivery hassle-free as you don’t need to be present at the delivery
location to hand over the cash, and this will also save your cash for future use.
Furthermore, our Amazon Clone App provides a card-on-delivery option for purchase. Due
to the rise of pandemics, many people are avoiding cash on delivery options yet are
skeptical about paying before getting the product.

8
For them, we have introduced the link or QR code scanner process. A consumer can scan
the QR code and pay the merchant without touching it. The delivery agent will send a link
on the registered mobile number by clicking it and redirecting them to the UPI payment
option to generate pay.

Product Comparison & Filters:

An Amazon clone app can store more than 100000 products under one roof. Your customer
can find similar types of products from various vendors and thus can easily compare their
price, quality, material, design, and delivery date. It saves the time to visit multiple stores to
purchase a product. CZ can all be found under one roof.

Moreover, an Amazon-like app will have various products from various categories. So,
searching for the best products that suit your consumer requirements must be tough and
time-consuming. That’s why we have introduced the robust filter option. Where your
customer can filter their requirements to narrow the search options, you can filter the
search based on color, size, price range, delivery date, etc.

Your Amazon Clone App is also beneficial for the vendors, and we have introduced a series
of features so that more vendors can register themselves into your ecommerce
platform. Check them out.

Product details with customization:

A vendor can give minute details of the listed products so that a customer can get all the
necessary information. Apart from that, we offer them customization options where a
vendor can add or customize certain details that the customer might feel interested in.

Bulk Selling:
Vendors can add a bulk number of products with a definite price amount for bulk selling.

Store details: A vendor can give the details of their physical store, like Google location,
operating hours, etc. So that a customer can go and pick up the product after ordering or
visit the store for further business.

White-label product selling:

A vendor can use his brand name and logo while his products are uploaded.

Besides providing these astonishing features to the user & vendors, our app is equipped
with these specialized details which help the admin to work & manage seamlessly, such as

9
• Admins can access all the data provided by vendors and customers
• They can approve the store listing request from the vendors after examining the credentials
• Can manage the products and remove that are no longer in the stock
• Can view and manage the feedback section and remove any spam review
• Can track any orders made by the customers and can communicate with the delivery
partners

Our Amazon Clone App will enrich you with the following benefits.

Provide A Personalized Experience:

Our Amazon Clone App is completely customizable and easy to launch. You can customize
these details as per your business requirements.

Lightning Speed:
We ensure the fastest loading time for the app on all kinds of devices. We always check for
bugs in the coding system and fix it accordingly. Thus all our users get robust functionality.

Advanced Bug support:

This unique bug tracking feature of ours helps to detect and remove bugs seamlessly

Multiple Panels for Each user:

We provide three distinct panels for consumers, admins & vendors for smooth functioning

Multi App Platforms:

Our App is functional on both Android & Apple and can be easily installed from the Google
play store or Apple’s App Store.

Finest Analytics Tool:

With our most advanced analytics tool, you can readily analyze all implied market strategy’s
working principles and effects. In case of any customer acquisition, you can readily analyze
it. Moreover, you will get to know customer behaviors, cart abandonment rates, etc.

10
Overview

The Amazon Clone app provides a multi-vendor ecommerce marketplace via which the
vendors and the users can communicate and sell/buy products. Users log in to the Amazon
clone application and complete the user authentication process.

Technology Used

• Programming Language:- HTML, CSS

• MIDDLEWARE:- Web Browser(Microsoft Edge, Google Chrome, Internet Explorer…)

DESCRIPTION OF TECHNOLOGY

What is HTML?

HTML is an acronym which stands for Hyper Text Markup Language which is used for
creating web pages and web applications. Let's see what is meant by Hypertext Markup
Language, and Web page.

Hyper Text: HyperText simply means "Text within Text." A text has a link within it, is a
hypertext. Whenever you click on a link which brings you to a new webpage, you have
clicked on a hypertext. HyperText is a way to link two or more web pages (HTML
documents) with each other.

11
Markup language: A markup language is a computer language that is used to apply layout
and formatting conventions to a text document. Markup language makes text more
interactive and dynamic. It can turn text into images, tables, links, etc.

Web Page: A web page is a document which is commonly written in HTML and translated
by a web browser. A web page can be identified by entering an URL. A Web page can be of
the static or dynamic type. With the help of HTML only, we can create static web pages.

Hence, HTML is a markup language which is used for creating attractive web pages with the
help of styling, and which looks in a nice format on a web browser. An HTML document is
made of many HTML tags and each HTML tag contains different content.

CSS Introduction

Cascading Style Sheets, fondly referred to as CSS, is a simply designed language intended to
simplify the process of making web pages presentable. CSS allows you to apply styles to
web pages. More importantly, CSS enables you to do this independently of the HTML that
makes up each web page. It describes how a webpage should look: it prescribes colours,
fonts, spacing, and much more. In short, you can make your website look however you
want. CSS lets developers and designers define how it behaves, including how elements are
positioned in the browser.

While HTML uses tags, CSS uses rulesets. CSS is easy to learn and understand, but it
provides powerful control over the presentation of an HTML document

12
System Design

13
E-R Diagram

14
<!Doctype html>
<html lang="en">
<head>

<link rel="stylesheet" href="style.css">

</head>

<div class="nav-address border">

<p class="add-first">Deliver to</p>
<div class="add-icon">
<i class="fa-solid fa-location-dot"></i>
<p class="add-second">India</p>
</div>
</div>

<div class="nav-search">
<select class="search-select">
<option>All</option>
<option value="1">Department</option>
<option value="2">Arts & Crafts</option>
<option value="3">Baby</option>
<option value="4">Beauty & personals care</option>
<option value="5">Books</option>
<option value="6">Boys fashions</option>
<option value="7">Computers</option>
<option value="8">Deals</option>
<option value="9">Digital Music</option>
<option value="10">Electronics</option>
<option value="11">Software</option>
<option value="12">pet Supplies</option>
<option value="13">Sports</option>
<option value="14">Men's fashion</option>
<option value="15">Movies and TV</option>
<option value="16">Video Games</option>
<option value="17">Kindle Store</option>
<option value="18">Prime Video</option>
<option value="19">Music,CDs,& Vinyl</option>
<option value="20">Home & Kitchen</option>
</select>

<input placeholder="Search Amazon" class="Search-input">

<div class="nav-signin border">

<p><span>Hello,<a href="index1.html" style="color: white;">
Sign-up</a></span></p>
<p class="nav-second">Account & Lists</p>
</div>

<div class="nav-signin border">

<p><span>Return</span></p>
<p class="nav-second">& Orders</p>
</div>

</div>

<div class="panel-options">
<p>Today's Deals</p>
<p>Registry</p>
<p>Customer Service</p>
<p>Gift Cards</p>
<p>Sell</p>
</div>

<div class="panel-deals">
Shop deals in Electronics
</div>
</div>

</header>

<div class="hero-section">
<div class="hero-message">
<p>You are on amazon.com. You can also shop on Amazon India
for millions of products with fast local delivery.
<a href="https://www.amazon.com">Click here to go to
amazon.in</a></p>
</div>
</div>

<div class="shop-section">
<div class="box1 box">
<div class="box-content">
<h2>Cloths & personal care</h2>
<a
href="https://www.amazon.com/s?k=cloth&crid=1X577BCU9C2BX&s
prefix=cloth%2Caps%2C533&ref=nb_sb_noss_2"> <div class="box-
image" style="background-image: url('box1_image.jpg');"></div></a>
<p>See more</p>
</div>
</div>

<div class="box2 box">

<div class="box-content">
<h2>Upgrade your office furniture</h2>
<a
href="https://www.amazon.com/s?k=office+furniture&crid=9VIWQ5I
DTLTX&sprefix=office+furni%2Caps%2C378&ref=nb_sb_ss_ts-doa-
p_1_11"> <div class="box-image" style="background-image:
url('box2_image.jpg');"></div></a>
<p>See more</p>
</div>
</div>

<div class="box3 box">

<div class="box-content">
<h2>Refresh your space</h2>
<div class="box-image" style="background-image:
url('box3_image.jpg');"></div>
<p>See more</p>
</div>
</div>

<div class="box4 box">

<div class="box-content">
<h2>Top Deals</h2>
<div class="box-image" style="background-image:
url('box4_image.jpg');"></div>
<p>See more</p>
</div>
</div>

<div class="box5 box">

<div class="box-content">
<h2>Deals in PCs</h2>
<a
href="https://www.amazon.com/gp/goldbox/?ie=UTF8&deals-
widget=%257B%2522version%2522%253A1%252C%2522viewIndex%
2522%253A0%252C%2522presetId%2522%253A%252219A70421F1B
18305BA3C837E25E8FDF9%2522%252C%2522departments%2522%
253A%255B%2522541966%2522%255D%252C%2522sorting%2522%
253A%2522FEATURED%2522%257D&pd_rd_w=HZAHd&content-
id=amzn1.sym.3a6a1f11-a96c-444b-b219-
97322616eb92&pf_rd_p=3a6a1f11-a96c-444b-b219-
97322616eb92&pf_rd_r=E0YAYAVY2ZWM607C3MA9&pd_rd_wg=EG
yH5&pd_rd_r=e0967b66-cf07-4205-8c97-
1a38713b1f64&ref_=pd_gw_unk#dealsGridLinkAnchor"><div
class="box-image" style="background-image:
url('box5_image.jpg');"></div></a>
<p>See more</p>
</div>
</div>

<div class="box6 box">

<div class="box-content">
<h2>Health and personal care</h2>
<div class="box-image" style="background-image:
url('box6_image.jpg');"></div>
<p>See more</p>
</div>
</div>

<div class="box7 box">

<div class="box-content">
<h2>Toys</h2>
<div class="box-image" style="background-image:
url('box7_image.jpg');"></div>
<p>See more</p>
</div>
</div>
<div class="box8 box">
<div class="box-content">
<h2>Shop holiday gift guides</h2>
<div class="box-image" style="background-image:
url('box8_image.jpg');"></div>
<p>See more</p>
</div>
</div>

<div class="box9 box">

<div class="box-content">
<h2>Personal care</h2>
<div class="box-image" style="background-image:
url('box9_image.jpg');"></div>
<p>See more</p>
</div>
</div>

<div class="box10 box">

<div class="box-content">
<h2>For pet animals</h2>
<div class="box-image" style="background-image:
url('box10_image.jpg');"></div>
<p>See more</p>
</div>
</div>

<div class="box11 box">

<div class="box-content">
<h2>Laptops for every need</h2>
<div class="box-image" style="background-image:
url('box11_image.jpg');"></div>
<p>See more</p>
</div>
</div>

<div class="box12 box">

<div class="box-content">
<h2>Great deals for make-up</h2>
<div class="box-image" style="background-image:
url('box12_image.jpg');"></div>
<p>See more</p>
</div>
</div>
</div>

<div class="foot-panel2">
<ul>
<p>Get to Know Us</p>
<a href="R"> Careers</a>
<a href="u"> Blog</a>
<a href="p"> About Amazon</a>
<a href="e"> Investor Relations</a>
<a href="s"> Amazon Devices</a>
<a href="h"> Amazon Science</a>
</ul>

<ul>
<p>Make Money with Us</p>
<a>Sell products on Amazon</a>
<a>Sell on Amazon Business </a>
<a>Sell apps on Amazon</a>
<a>Become an Affiliate</a>
<a>Advertise Your Products</a>
<a>Self-Publish with Us</a>
<a>Host an Amazon Hub</a>
</ul>
<ul>
<p>Amazon Payment Products</p>
<a>Amazon Business Card</a>
<a>Shop with Points</a>
<a>Reload Your Balance</a>
<a>Amazon Currency Converter</a>
</ul>

<ul>
<p>Let Us Help You</p>
<a>Amazon and COVID-19</a>
<a>Your Account</a>
<a>Your Orders</a>
<a>Shipping Rates & Policies</a>
<a>Returns & Replacements</a>
<a>Manage Your Content and Devices</a>
<a>Amazon Assistant</a>
<a>Help</a>
</ul>
</div>

<div class="foot-panel4">
<div class="pages">
<a>Conditions of Use</a>
<a>Privacy Notice</a>
<a>Your Ads Privacys choices</a>
</div>

<div class="copyright">
© 1996-2023, Amazon.com, Inc. or its affiliates
</div>

</div>
</footer>
</body>
</html>
*{
margin: 0;
font-family: Arial;
border: border-box;

.navbar{
height: 60px;
background-color: #0f1111;
color: white;
display :flex;
align-items: center;
justify-content: space-evenly;

.nav-logo{
height: 50px;
width: 100px;

}
.logo{
background-image: url("amazon_logo.png");
background-size: cover;
height: 50px;
width: 100px;

.border{
border: 1.5px solid transparent;

.border:hower{
border: 1.5px solid white;

/ Box2 /

.add-first{
color: #cccccc;
font-size: 0.8rem;
margin-left: 15px;
}

.add-second{
font-size: 1rem;
margin-left: 4px;

.add-icon{
display:flex;
align-items: center;

/ Box3 /

.nav-search{
display: flex;
justify-content: space-evenly;
background-color: pink;
width: 300px;
height: 40px;
border-radius: 4px;
mar

.search-select{
background-color: #f3f3f3;
width: 50px;
text-align: center;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
border: none;

.search-input{
width: 100%;
font-size: 1rem;
border: none;

.search-icon{
width: 45px;
display: flex;
justify-content: center;
align-items: center;
font-size: 1.2rem;
background-color: #febd68;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
color: #0f1111;

.nav-search:hover{
border:2px solid orange;

/ Box4 /

span{
font-size: 0.90rem;

}
.nav-second{
font-size: 0.85rem;
font-weight: 700;

/ Box6 /

.nav-cart i {
font-size: 30px;

.nav-cart{
font size: ;
}

/ panel /

.panel{
height: 40px;
background-color: rgb(230, 72, 55);
display: flex;
color: white;
align-items: center;
justify-content: space-evenly;
}

.panel-options p{
display: inline;
margin-left: 15px;
/** color: white;
align-items: center;
justify-content: space-evenly; **/

.panel-options{
width: 80%;
font-size: 0.90rem;

.panel-deals{
font-size: 1rem;

/ hero section /

.hero-section{
background-image: url(hero_image.jpg);
background-image: url(hero_image2.jpg);
background-image: url(hero_image3.jpg);
background-image: url(hero4.jpg);
background-image: url(hero5.jpg);
background-image: url(image13.jpg);
background-image: url(image14.jpg);
background-size: cover;
height: 400px;
display: flex;
justify-content: center;
align-items: flex-end;
animation-name: myani;
animation-duration: 30s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-timing-function:cubic-bezier(0.075, 0.82, 0.165, 1);

@keyframes myani{
0%{ background-image: url(hero_image.jpg);}
30%{ background-image: url(hero_image2.jpg);}
60%{ background-image: url(hero_image3.jpg);}
60%{ background-image: url(hero4.jpg);}
75%{ background-image: url(image13.jpg);}
70%{background-image: url(hero5.jpg);}
100%{ background-image: url(image14.jpg);}

.hero-message{
background-color: white;
color: black;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.85rem;
bottom: 25px;
width: 80%;
margin-bottom: 25px;

}
.hero-message a {
color: rgb(20, 167, 236);

/ Shop section /

.shop-section{
display: flex;
flex-wrap: wrap;

justify-content: space-evenly;
background-color: rgb(179, 215, 231);

.box{
height: 400px;
width: 23%;
background-color: aliceblue;
padding: 20px 0px 15px;
margin-top: 15px;

}
.box-image{
height: 300px;
background-repeat: no-repeat;
background-size: cover;
margin-top: 15px;
margin-bottom: 10px;

.box-content{
margin-left : 1rem;
margin-right: 1rem;
}

.box-content p {
color: rgb(0, 30, 255);

/ for footer /

footer{
margin-top: 3px;
}

.foot-panel1{
background-color: #37475a;
color: white;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
font-size: 0.85rem;

.foot-panel2{
background-color: #222f3d;
color: white;
height: 400px;
display: flex;
justify-content: space-evenly;

}
ul{
margin-top: 20px;
}

ul a {
display: block;
font-size: 0.85rem;
margin-top: 13px;
color: aliceblue;

.foot-panel3{
background-color: #222f3d;
color: white;
border-top: 1px solid white;
height: 70px;
display: flex;
justify-content: center;
align-items: center;

}
.logo{
background-image: url("amazon_logo.png");
background-size: cover;
height: 50px;

.foot-panel4{
background-color: #121d24;
color: white;
height: 85px;

/* display: flex;
justify-content: center;
align-items: center;
**/
}

.pages{
font-size: 0.85rem;
text-align: center;
padding-top: 25px;
}

.copyright{
padding-top: 6px;
text-align: center;
font-size: 0.85rem;

}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF=8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title> Amazon App clone </title>
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/6.5.1/css/all.min.css"
integrity="sha512-
DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlne
e1c9QX4TctnWMn13TZye+giMm8e2LwA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<title>Amazon SignIn page</title>

<link rel="stylesheet" href="sty.css">

</head>

<body>
<section>
<div class="logo">
<img src="logo.png" alt="">
<span>.in</span>
</div>
<div class="card">
<h1>Sign in</h1>
<div class="form">
<label for="">Email or phone number</label>
<input type="text">
<button>Continue</button>
</div>
<p>By continuing, you agree to amazon's <a
href="#">Conditions of Use</a> and <a href="#">Privacy
Notice</a>.</p>
<a href="#" class="icon"> Need help?</a>
</div>
<div class="break">
<p>New to Amazon?</p>
</div>
<div class="btn">
<button><a href="">Create your Amazon
account</a></button>
</div>
<footer>
<div class="links">
<a href="#">Conditions of Use</a>
<a href="#">Privacy Notice</a>
<a href="#">Help</a>
</div>
<p>@ 1996-2023, Amazon.com, Inc. or its affiliates</p>
</footer>
</section>
</body>
</html>
*{
margin: 0px;
padding: 0px;
font-family: Arial, Helvetica, sans-serif;
}

/ for logo /

.logo{
display: flex;
justify-content: center;
align-items: center;
}

.logo img{
width: 103px;
height: 31px;
margin-top: 15px;
}

.logo span{
margin-top: 10px;
font-size: 14px;
}

/ For card /

.card{
width: 296px;
height: 240px;
padding: 20px 26px;
display: flex;
justify-content: space-around;
flex-direction: column;
border: 1px solid #ddd;
border-radius: 4px;
margin: 20px auto 25px auto;
}

.card h1{
font-weight: 400;
font-size: 28px;
}

.card label{
font-size: 13px;
padding-left: 2px;
padding-bottom: 2px;
font-weight: 700;
}

.card input{
width: 272px;
height: 25px;
padding: 3px 7px;
margin-top: 3px;
background-color: #fff;
border: 1px solid #a6a6a6;
border-radius: 3px;
}

.card button{
width: 288px;
height: 31px;
margin-top: 10px;
background-color: #f0c14b;
border: 1px solid #a6a6a6;
border-top-color:#949494;
background-image: linear-gradient(#f7da90,#e2b33b);
border-radius: 3px;
}
.card p,.card p a{
font-size: 12px;
line-height: 2rem;
}

a{
text-decoration: none;
color: #0066c0;
}

.card a{
margin-top: 10px;
font-size: 13px;
}

.icon::before{
display: inline-block;
content: "";
border-top: 4px solid transparent;
border-left: 4px solid #949494;
border-bottom: 4px solid transparent;
margin-right: 10px;
}
.break p{
line-height: 1;
font-size: 12px;
color: #767676;
font-weight: 400;
position: relative;
display: inline-block;
background-color: #fff;
padding: 0 8px 0 7px;
}

.break, .btn{
display: flex;
justify-content: center;
}

.break::before,.break::after{
content: "";
position: relative;
top: 5px;
display: inline-block;
width: 120px;
border-top: 1px solid #e7e7e7;
}

.btn button{
width: 348px;
height: 31px;
margin: 15px auto;
background-color: #e7e9ec;
background-image: linear-gradient(#f9f9fa, #e7e9ec);
border: 1px solid #a6a6a6;
border-top-color: #949494;
border-radius: 3px;
}

footer .links{
display: flex;
justify-content: space-between;
width: 250px;
margin: 25px auto 15px auto;
}

footer .links a{
font-size: 12px;

}
footer::before{
content: "";
display: flex;
justify-content: center;
width: 80%;
margin: auto;
height: 44px;
margin-top: -35px;
border-top: 1px solid transparent;
box-shadow: 0 10px 15px -20px #333;
}

footer p{
font-size: 11px;
color: #555;
text-align: center;
}
<html>
<head>
<title>
Amazon sign up page
</title>
</head>
<body>
<center>
<table border="2">
<tr>
<td>
<div>
<center>
<h1>Amazon sign up</h1>
<form>
<input type="text" placeholder="Username"><br>
<input type="text" placeholder="E-mail"><br>
<input type="text" placeholder="Enter Password"><br>
<input type="text" placeholder="Confirm Password"><br>
</div>
<div>
<input type="checkbox" id="checkbox">
<label for="checkbox">Clicking the sign up Botton,before
agree to our
<a href="term and conditions">terms &
conditions</a></label><br>
</div>
<div>
<center> <button>sign up </button></center><br>
Already have an account?<a href="Sign.html">Sign in</a>

</div>

</form>
</center>
</td>
</tr>
</table>
</center>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF=8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title> Amazon App clone </title>
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/6.5.1/css/all.min.css"
integrity="sha512-
DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlne
e1c9QX4TctnWMn13TZye+giMm8e2LwA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<title>Amazon SignIn page</title>

<link rel="stylesheet" href="sty.css">

</head>

<body>
<section>
<div class="logo">
<img src="logo.png" alt="">
<span>.in</span>
</div>
<div class="card">
<h1>Sign in</h1>
<div class="form">
<label for="">Email or phone number</label>
<input type="text">
<button>Continue</button>
</div>
<p>By continuing, you agree to amazon's <a
href="#">Conditions of Use</a> and <a href="#">Privacy
Notice</a>.</p>
<a href="#" class="icon"> Need help?</a>
</div>
<div class="break">
<p>New to Amazon?</p>
</div>
<div class="btn">
<button><a href="sign up.html"> Create your Amazon
account</a></button>
</div>
<footer>
<div class="links">
<a href="#">Conditions of Use</a>
<a href="#">Privacy Notice</a>
<a href="#">Help</a>
</div>
<p>@ 1996-2023, Amazon.com, Inc. or its affiliates</p>
</footer>
</section>
</body>
</html>
6 Amazon sign up page X + X

O File C/Users/91700/ Desktop/project%20f/sign%20up.html?

Amazon sign up
Username
E-mail
Enter Password
Confirm Password

O Clicking the sign up Botton,before agree to our terms &conditions

Already have an account?Sign in

6 Amazon App clone 6 Amazon App clone X X

O File C/Users/91700/Desktop/project%20f/findex.html
J e e IOTe JeeIOTe JeeIOTe JeeIIOTe

Get to Know Us Make Money with Us Amazon Payment Products Let Us Help You
Careers Sell products on Amazon Amazon Business Card Amazon and COVID-19

Blog Sell on Amazon Business Shop with Points Your Account

About Amazon Sell apps on Amazon Reload Your Balance Your Orders

Investor Relations Become an Affiliate Amazon Currency Converter Shipping Rates &Policies
Amazon Devices Advertise Your Products Returns &Replacements
Amazon Science Self-Publish with Us Manage Your Content and Devices
Host an Amazon Hub Amazon Assistant

Help

amazon

Conditions of Use Privacy Notice Your Ads Privacys choices

ENG 05:14 PM
Q Search PRE IN 21-Dec-23
6 Amazon App clone X S Amazon App clone X X

O File C/Users/91700/Desktop/project%20f/index.html

Personal care For pet animals Laptops for every need Great deals for make-up

See more See more See more See more

Get to Know Us Make Money with Us Amazon Payment Products Let Us Help You
Careers Sell products on Amazon Amazon Business Card Amazon and COVID-19

Blog Sell on Amazon Business Shop with Points Your Account

AboutAmazon Sell apps on Amazon Reload Your Balance Your Orders

Investor Relations Become an Affiliate Amazon Currency Converter Shipping Rates &Policies
ENG 05:13 PM
Q Search PRE IN 21-Dec-23
6 Amazon App clone 5 Amazon App clone X X

O File C/Users/91700/Desktop/project%20f/findex.html

Cloths & personal care Upgrade your office Refresh your space Top Deals
furniture

ANOPE

See more See more See more

Deals in PCs Health and personal care Toys Shop holiday gift guides

ENG 05:13 PM
Q Search PRE IN 21-Dec-23
Amazon App clone Amazon App clone X

O File C/Users/91700/Desktop/project%20f/index.html

ANEFind Delightful deals

da dsforeveryone all
: jAn

You are on amazon.com. You can also shop on Amazon India for millions of products with fast local delivery. Click here to go to amazon.in
S Amazon App clone 6 Amazon App clone X

O File C/Users/91700/Desktop/project%20f/index.html