Create color.js

This commit is contained in:
Руслан 2023-08-19 16:08:12 +06:00 committed by GitHub
parent 3414a4d6ef
commit b16e8e09d3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

153
static/js/color.js Normal file
View File

@ -0,0 +1,153 @@
const colorNames = [
`AliceBlue`,
`AntiqueWhite`,
`Aqua`,
`Aquamarine`,
`Azure`,
`Beige`,
`Bisque`,
`BlanchedAlmond`,
`Blue`,
`BlueViolet`,
`BurlyWood`,
`CadetBlue`,
`Chartreuse`,
`Coral`,
`CornflowerBlue`,
`Cornsilk`,
`Crimson`,
`Cyan`,
`DarkCyan`,
`DarkGoldenRod`,
`DarkGray`,
`DarkGrey`,
`DarkGreen`,
`DarkKhaki`,
`DarkMagenta`,
`DarkOliveGreen`,
`Darkorange`,
`DarkOrchid`,
`DarkRed`,
`DarkSalmon`,
`DarkSeaGreen`,
`DarkSlateBlue`,
`DarkSlateGray`,
`DarkSlateGrey`,
`DarkTurquoise`,
`DarkViolet`,
`DeepPink`,
`DeepSkyBlue`,
`DimGray`,
`DimGrey`,
`DodgerBlue`,
`FloralWhite`,
`ForestGreen`,
`Fuchsia`,
`Gainsboro`,
`GhostWhite`,
`Gold`,
`GoldenRod`,
`Gray`,
`Grey`,
`Green`,
`GreenYellow`,
`HoneyDew`,
`HotPink`,
`IndianRed`,
`Indigo`,
`Ivory`,
`Khaki`,
`Lavender`,
`LavenderBlush`,
`LawnGreen`,
`LemonChiffon`,
`LightBlue`,
`LightCoral`,
`LightCyan`,
`LightGoldenRodYellow`,
`LightGray`,
`LightGrey`,
`LightGreen`,
`LightPink`,
`LightSalmon`,
`LightSeaGreen`,
`LightSkyBlue`,
`LightSlateGray`,
`LightSlateGrey`,
`LightSteelBlue`,
`LightYellow`,
`Lime`,
`LimeGreen`,
`Linen`,
`Magenta`,
`MediumAquaMarine`,
`MediumBlue`,
`MediumOrchid`,
`MediumPurple`,
`MediumSeaGreen`,
`MediumSlateBlue`,
`MediumSpringGreen`,
`MediumTurquoise`,
`MediumVioletRed`,
`MintCream`,
`MistyRose`,
`Moccasin`,
`NavajoWhite`,
`OldLace`,
`Olive`,
`OliveDrab`,
`Orange`,
`OrangeRed`,
`Orchid`,
`PaleGoldenRod`,
`PaleGreen`,
`PaleTurquoise`,
`PaleVioletRed`,
`PapayaWhip`,
`PeachPuff`,
`Peru`,
`Pink`,
`Plum`,
`PowderBlue`,
`Purple`,
`Red`,
`RosyBrown`,
`RoyalBlue`,
`Salmon`,
`SandyBrown`,
`SeaGreen`,
`SeaShell`,
`Silver`,
`SkyBlue`,
`SlateBlue`,
`SlateGray`,
`SlateGrey`,
`Snow`,
`SpringGreen`,
`SteelBlue`,
`Tan`,
`Teal`,
`Thistle`,
`Tomato`,
`Turquoise`,
`Violet`,
`Wheat`,
`White`,
`WhiteSmoke`,
`Yellow`,
`YellowGreen`,
];
function getRandomColorName() {
const randomIndex = Math.floor(Math.random() * colorNames.length);
return colorNames[randomIndex];
}
function setRandomColor() {
const colorBox = document.querySelector('.color-box');
const randomColorName = getRandomColorName();
colorBox.style.setProperty('--maincolor', randomColorName);
}
// Set random color on page load
window.addEventListener('load', setRandomColor);