html
html
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
<!DOCTYPE html>
<html>
<head>
<title>Google Clone</title>
</head>
<body>
<!-- fonts -->
<link href="https://fonts.googleapis.com/css?family=Rubik&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Noto+Sans&display=swap" rel="stylesheet">
<!-- Page content -->
<header>
<ul>
<div align="right">
<input type="submit" value="Sign in" class="signin"></input> </div>
<svg class="dots" focusable="false" draggable=”false” viewBox="0 0 24 24"><path d="M6,8c1.1,0 2,-0.9 2,-2s-0.9,-2 -2,-2 -2,0.9 -2,2 0.9,2 2,2zM12,20c1.1,0 2,-0.9 2,-2s-0.9,-2 -2,-2 -2,0.9 -2,2 0.9,2 2,2zM6,20c1.1,0 2,-0.9 2,-2s-0.9,-2 -2,-2 -2,0.9 -2,2 0.9,2 2,2zM6,14c1.1,0 2,-0.9 2,-2s-0.9,-2 -2,-2 -2,0.9 -2,2 0.9,2 2,2zM12,14c1.1,0 2,-0.9 2,-2s-0.9,-2 -2,-2 -2,0.9 -2,2 0.9,2 2,2zM16,6c0,1.1 0.9,2 2,2s2,-0.9 2,-2 -0.9,-2 -2,-2 -2,0.9 -2,2zM12,8c1.1,0 2,-0.9 2,-2s-0.9,-2 -2,-2 -2,0.9 -2,2 0.9,2 2,2zM18,14c1.1,0 2,-0.9 2,-2s-0.9,-2 -2,-2 -2,0.9 -2,2 0.9,2 2,2zM18,20c1.1,0 2,-0.9 2,-2s-0.9,-2 -2,-2 -2,0.9 -2,2 0.9,2 2,2z"></path></svg>
Enter to Rename, Shift+Enter to Preview
css
css
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
body {
font-family: Arial;
overflow-x: hidden;
}
.signin {
background:linear-gradient(to bottom, #fafafa 5%, #fafafa 100%);
background-color: #fafafa;
border-radius:4px;
border:1px solid #c4c4c4;
display:inline-block;
cursor:pointer;
color: #636363;
font-size:17px;
padding: 9px 14px;
text-decoration:none;
margin-top: 10px;
margin-right: 13px;
font-family: Arial
}
.signin:hover {
background:linear-gradient(to bottom, #fafafa 5%, #fafafa 100%);
Enter to Rename, Shift+Enter to Preview
js
js
1
2
alert('This code is ONLY Design. \n It is not a responsive code. \n The theme might change in the near future, So dont worry. ');
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run