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>
<!--1.Click the Color Cubes to get corresponding Hash codes-->
<!--2.Don't forget to upvote,suggestions are always Welcome:> -->
<!--3.You can save it for future reference . While working on a project you can open this file on another tab or in a browser so you can easily switch -->
<!--4.Do not copy the code with or without credits and publish as your's-->
<html>
<head>
<link href ='https://fonts.googleapis.com/css?family=Handlee' rel="stylesheet">
<title>Page Title</title>
</head>
<body>
<div class="display"> <textarea id="text" readonly="true">Color Code</textarea>
<button Id="copy" onClick="myFunction()">CopyText </button>
<div class="content">
<h3> Blue Shades</h3>
<div class="di" onClick="p1()"></div>
<div class="di" onClick="p2()"></div>
<div class="di" onClick="p3()"></div>
<div class="di" onClick="p4()"></div>
<div class="di" onClick="p5()"></div>
<div class="di" onClick="p6()"></div>
<div class="di" onClick="p7()"></div>
<div class="di" onClick="p8()"></div>
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 {
background-color:#efefef;
}
.di{
display:inline-grid;
width:50px;
height:50px;
margin-left:20px;
margin-top:20px;
border:2px solid #0ff;
border-radius:20px;
cursor:pointer;
}
.di:hover{
border-color:#ffff66;
border-radius:10px;
}
.content{
z-index:1;
margin:5px;
margin-bottom:35px;
Enter to Rename, Shift+Enter to Preview
js
js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
function myFunction() {
/* Get the text field */
var copyText = document.getElementById("text");
/* Select the text field */
copyText.select();
copyText.setSelectionRange(0, 99999); /*For mobile devices*/
/* Copy the text inside the text field */
document.execCommand("copy");
/* Alert the copied text */
alert("Copied the text: " + copyText.value);
}
window.onload=()=>{
let boxes = document.querySelectorAll('.di');
for(let i of boxes){
i.addEventListener('click',()=>{
document.body.style.backgroundColor = i.style.backgroundColor;
})
}
}
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run