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
<!-- Created by Didi Georgel Danaila -->
<!DOCTYPE html>
<html>
<head>
<title>COLOR PICKER</title>
</head>
<body>
<h3>COLOR PICKER<br />if you like colors give me a like </br>☆☆☆ by didi ☆☆☆</h3>
<div id="rgb" onclick="getYourColor()"><h2>#000000</h2></div>
<div class="ddg" id="divRed" style="color:red" onclick="input(x,r)">RED</div>
<input type="range" class="space" id="red" min="0" max="255" step="1" value="0" onchange="getColor()"></input>
<div class="ddg" id="divGreen" style="color:green" onclick="input(y,g)">GREEN</div>
<input type="range" class="space" id="green" min="0" max="255" step="1" value="0" onchange="getColor()"></input>
<div class="ddg" id="divBlue" style="color:blue" onclick="input(z,b)"> BLUE</div>
<input type="range" class="space" id="blue" min="0" max="255" step="1" value="0" onchange="getColor()"></input>
<footer>
<marquee scrolldelay="100">
<h4 id="mess">
<a href="https://lm.facebook.com/l.php?u=https%3A%2F%2Fcode.sololearn.com%2FWJly9ZuywWBU%2F%3Ffbclid%3DIwAR3o22bFqo30ooTgYaVm9t9VkP8tbNmMJ0JOQWZIbW-yTf9SSL8G4_hKM7Y%23html&h=AT37z8beEcTWLGo0icGvMN7bcpVU0n900EJm209DfVSTLFgdhoqlci7zMCE9OeAyB5cjXyUqC_axil1-TEKc9VLJl5n8QXJtuPMyp5tzFr1PK7txXHIBx2bIV9qCR6Yw9SzJFlz1ai89zVQZ3iwryKU ">
CODE OF THE DAY ==> check out
</a>
</h4>
</marquee>
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
/* Created by Didi Georgel Danaila */
@import url("https://fonts.googleapis.com/css?family=Shadows+Into+Light");
@import url("https://fonts.googleapis.com/css?family=Poiret+One");
body {
text-align:center;
background-color:black;
text-transform:capitalize;
font-family: 'Shadows Into Light'; cursive, sans-serif;
}
#rgb {
width:auto;
height:auto;
border-style:solid;
border-width:3 px;
border-radius:200px;
border-color:black;
background-color:#ffffff;
font-family: 'Poiret One', bold, sans-serif;
}
h3 {
background-image: -webkit-gradient( linear, left top, right top, color-stop(0, #f22), color-stop(0.15, #f2f), color-stop(0.3, #22f), color-stop(0.45, #2ff), color-stop(0.6, #2f2),color-stop(0.75, #2f2), color-stop(0.9, #ff2), color-stop(1, #f22) );
background-image: gradient( linear, left top, right top, color-stop(0, #f22), color-stop(0.15, #f2f), color-stop(0.3, #22f), color-stop(0.45, #2ff), color-stop(0.6, #2f2),color-stop(0.75, #2f2), color-stop(0.9, #ff2), color-stop(1, #f22) );
color:transparent;
-webkit-background-clip: text;
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
25
26
27
28
// Created by Didi Georgel Danaila
alert("Thank you for upvoting this code.\n");
var x = 0, y = 0, z =0 ,color, r = "RED" ,g = "GREEN ", b = "BLUE ";
function getColor(){
x = document.getElementById("red").value;
document.getElementById("divRed").innerHTML = 'RED = '+x;
y = document.getElementById("green").value;
document.getElementById("divGreen").innerHTML = 'GREEN = '+y;
z = document.getElementById("blue").value;
document.getElementById("divBlue").innerHTML = 'BLUE = '+z;
var color = rgbToHex(x,y,z);
color = "#"+color;
document.body.style.backgroundColor = color;
document.getElementsByTagName("h2")[0].innerHTML = color;
var newColor0 = rgbToHex(255-x,y,z);
newColor0 = "#"+newColor0;
var newColor1 = rgbToHex(x,255-y,z);
newColor1 = "#"+newColor1;
var newColor2 = rgbToHex(x,y,255-z);
newColor2 = "#"+newColor2;
var dac = document.getElementsByClassName("ddg");
dac[0].style.backgroundColor = newColor0 ;
dac[0].style.color ="#ffffff";
dac[1].style.backgroundColor = newColor1;
dac[1].style.color ="#ffffff";
dac[2].style.backgroundColor = newColor2;
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run