mirror of
https://github.com/Karaka-Management/cOMS.git
synced 2026-01-10 19:08:39 +00:00
68 lines
4.2 KiB
HTML
Executable File
68 lines
4.2 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>16x16 Color Picker Table</title>
|
|
<style>
|
|
body {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 100vh;
|
|
margin: 0;
|
|
background-color: #fff;
|
|
}
|
|
|
|
table {
|
|
border: 1px solid #000;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
td {
|
|
width: 6%;
|
|
height: 6%;
|
|
padding: 0;
|
|
margin: 0;
|
|
border: 1px solid #000;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<table id="colorTable"></table>
|
|
<script>
|
|
const table = document.getElementById('colorTable');
|
|
|
|
const colors = [
|
|
"#", "#FFFFFF", "#E9E9E9", "#D9D9D9", "#C9C9C9", "#B9B9B9", "#A9A9A9", "#999999", "#898989", "#797979", "#696969", "#595959", "#494949", "#393939", "#1F1F1F", "#000000",
|
|
"#F6D3CF", "#F8C2BD", "#FB9E91", "#FC8B7E", "#FC796C", "#FD675B", "#FF554B", "#FF4340", "#F82D2E", "#F6171B", "#E60412", "#CC0004", "#A70004", "#7A0306", "#4f0107", "#330004",
|
|
"#FDDDCE", "#FCCFB6", "#FDB69E", "#F5A78C", "#F69B7E", "#FF8A65", "#FF7A50", "#FB683A", "#F95523", "#F34413", "#D8390A", "#B22F07", "#8F2905", "#742406", "#57200A", "#2b0d05",
|
|
"#FCEBCF", "#FCDAB2", "#FCCB96", "#FBBE7C", "#F3B067", "#FCA45F", "#FB913E", "#FF7F1C", "#E76E09", "#D06B00", "#B05F00", "#9C5300", "#824A00", "#6E3B06", "#5A2E05", "#351700",
|
|
"#FFF6C9", "#FFEDB1", "#FFE593", "#FDDC74", "#F9D36A", "#FFC94F", "#FFBD1E", "#F4B600", "#D2A200", "#B78E04", "#9D7D00", "#8C6F07", "#776300", "#614F00", "#503D00", "#392900",
|
|
"#FFFFCD", "#FEFDBC", "#FCF9A3", "#FBF583", "#FAF065", "#FFEA2B", "#FEEB04", "#E9DC00", "#D7CC00", "#C4BA00", "#ADA500", "#9A9200", "#7C7700", "#605B00", "#4F4C00", "#343700",
|
|
"#E4FFBD", "#DBFDBC", "#CEF9A3", "#C4F48E", "#BAEE76", "#B1E760", "#9FEF29", "#97E313", "#7FC900", "#78BB00", "#67A201", "#5C8E02", "#527F01", "#426600", "#334F00", "#203700",
|
|
"#E1F8D8", "#C7F8C2", "#ADF5AB", "#9EEC97", "#85E47F", "#66DF66", "#4EDB5F", "#23D138", "#12C72C", "#0EB522", "#109B17", "#0A8913", "#077311", "#066011", "#004F06", "#003100",
|
|
"#D5FFF8", "#C5FDF4", "#A8F7E5", "#99F0D7", "#7BF1C6", "#60E6B1", "#53E0A0", "#1CE76F", "#0DD763", "#0AD056", "#02B548", "#04A94D", "#009A40", "#088133", "#005A2B", "#00331A",
|
|
"#D9FDFE", "#B5FBFE", "#A8FFFF", "#92FFFF", "#7AFDFF", "#66F9FD", "#0FF8FE", "#1CE7F5", "#06C5C9", "#0BA2B2", "#04A39E", "#079A8E", "#008B7D", "#027A7A", "#004D4F", "#003135",
|
|
"#E2F5FF", "#B4EBFF", "#A3DAFF", "#89CCF8", "#79D1FF", "#61C3F7", "#59C5F3", "#3FB9F6", "#05A4FA", "#0592F0", "#0677B8", "#00649A", "#065A77", "#004974", "#003154", "#00243e",
|
|
"#D1DDFF", "#B5D0EF", "#A7BFF6", "#90B6F4", "#85AAF7", "#67AAFF", "#5386FF", "#437AFF", "#3A6AFF", "#044EFC", "#034EF7", "#0A37BF", "#09268B", "#062871", "#001D4C", "#001435",
|
|
"#C7C3FF", "#C7C6FE", "#9D9CFF", "#9194F6", "#7E81FE", "#776FF7", "#595AFF", "#4852FF", "#2D2EFF", "#2020F8", "#0400E1", "#0000DD", "#010097", "#000086", "#03005D", "#020035",
|
|
"#E1D4FF", "#D8ACFF", "#CD9BFF", "#C88DFA", "#BD8AF9", "#B160FF", "#AA52FE", "#9841FD", "#8726FF", "#8700F5", "#7200F4", "#5C00B7", "#460489", "#350077", "#28004F", "#1c0037",
|
|
"#FFC7FF", "#FFB8FF", "#FFAAFF", "#F194F7", "#F681F5", "#F77CF1", "#F76DFF", "#F956FF", "#F82FFF", "#EA00E6", "#D200CB", "#B500B3", "#A6009C", "#8A0084", "#6F005E", "#330035",
|
|
"#FDD2E6", "#F9B5DA", "#F7A4D4", "#F198CB", "#F682BD", "#FF5FAE", "#FF4CA9", "#FF3CA4", "#FF1A94", "#F90979", "#E80071", "#C40061", "#96004A", "#670132", "#4F0024", "#310016",
|
|
];
|
|
|
|
for (let r = 0; r < 16; r++) {
|
|
const row = document.createElement('tr');
|
|
for (let g = 0; g < 16; g++) {
|
|
const colorValue = `${colors[r * 16 + g]}`;
|
|
const cell = document.createElement('td');
|
|
cell.style.backgroundColor = colorValue;
|
|
row.appendChild(cell);
|
|
}
|
|
table.appendChild(row);
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |