Berikut adalah contoh kode untuk membuat aplikasi kode warna lengkap dengan JavaScript yang menampilkan nama dan kode warna yang lengkap beserta CSS dan penerapannya ke dalam form HTML.
Aplikasi Kode Warna Lengkap
HTML
<!DOCTYPE html>
<html>
<head>
<title>Aplikasi Kode Warna Lengkap</title>
<style>
.color-box {
display: inline-block;
width: 100px;
height: 100px;
margin: 10px;
border: 1px solid #000;
}
</style>
</head>
<body>
<h1>Aplikasi Kode Warna Lengkap</h1>
<form>
<label for="color">Pilih Warna:</label>
<input type="color" id="color" name="color">
<button type="button" onclick="addColor()">Tambahkan</button>
</form>
<div id="colorList"></div>
<script>
function addColor() {
var colorInput = document.getElementById("color");
var color = colorInput.value;
var colorBox = document.createElement("div");
colorBox.className = "color-box";
colorBox.style.backgroundColor = color;
var colorName = document.createElement("span");
colorName.textContent = color;
var colorList = document.getElementById("colorList");
colorList.appendChild(colorBox);
colorList.appendChild(colorName);
}
</script>
</body>
</html>Silakan gunakan kode di atas untuk membuat aplikasi kode warna lengkap yang Anda inginkan. Jika Anda memiliki pertanyaan lebih lanjut, jangan ragu untuk bertanya.
Leave a Reply