कलर बॉक्स

2139 Huzaifa

संपादक में खोलें अपना कोड प्रकाशित करें

अनुशंसित

9 December 2024

बैकग्राउंड-कलर को एनिमेट कैसे करें

19 May 2025

गेम एनीमेशन के लिए फ्लाई बॉक्स

1 June 2025

होम 3D रोटेशन लॉगिन/साइनअप बॉक्स

HTML

<html>
<head>
    <title>Color Generator</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div class="container mt-5">
        <div class="row">
            <div class="col">
                <input type="text" id="inputColors" class="form-control mb-3" placeholder="Enter color(s)">
                <button onclick="generateColors()" class="btn btn-primary">Generate Colors</button>
            </div>
        </div>
        <div class="row mt-3">
            <div class="col">
                <div id="outputColors" class="color-box mt-3"></div>
            </div>
        </div>
    </div>

colors.forEach(color => {
                const colorBox = document.createElement("div");
                colorBox.style.backgroundColor = color;
                colorBox.classList.add("generated-color");
                outputColors.appendChild(colorBox);
            });
        }
    </script>

.generated-color {
            width: 50px;
            height: 50px;
            margin: 5px;
            border: 1px solid black;
        }
    </style>

कलर बॉक्स

अनुशंसित

बैकग्राउंड-कलर को एनिमेट कैसे करें

गेम एनीमेशन के लिए फ्लाई बॉक्स

होम 3D रोटेशन लॉगिन/साइनअप बॉक्स

HTML

CSS

JS

अनुशंसित

बैकग्राउंड-कलर को एनिमेट कैसे करें

गेम एनीमेशन के लिए फ्लाई बॉक्स

होम 3D रोटेशन लॉगिन/साइनअप बॉक्स

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS