mirror of
https://github.com/Karaka-Management/cOMS.git
synced 2026-01-11 11:18:40 +00:00
68 lines
4.2 KiB
HTML
68 lines
4.2 KiB
HTML
<!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", "#F1EEED", "#DCDEDE", "#BFC1BF", "#AEB0AD", "#9E9D9E", "#8E8F94", "#717373", "#5E5F61", "#4D4D4C", "#3F403A", "#332C2A", "#241E22", "#0C1210", "#000000",
|
|
"#F6D3CF", "#FABABC", "#FBA699", "#F19580", "#FB837A", "#FC615A", "#FF4E4B", "#FF4040", "#F72128", "#F60303", "#E40000", "#C70002", "#900009", "#630604", "#4f0107", "#2d0205",
|
|
"#FDDDCE", "#FCC5AC", "#FFB9A4", "#F6A378", "#F49A80", "#FF7D4F", "#F8742C", "#FE5A22", "#F44A0B", "#DA3A06", "#C03500", "#853004", "#912600", "#672300", "#471608", "#2b0d05",
|
|
"#FCEBCF", "#FCD8AA", "#FFCD98", "#FCC27F", "#F3B267", "#FDA660", "#FD942D", "#FF8001", "#DF6E00", "#CC6B00", "#A85D00", "#A55300", "#734700", "#612D08", "#562600", "#351700",
|
|
"#FFF6C9", "#FFECA8", "#FDE884", "#FADC6D", "#F8DE6F", "#FFCF43", "#FFBD00", "#EBB800", "#C1A800", "#BC8F09", "#9B7A00", "#8E6C08", "#795F01", "#5C4A00", "#523B00", "#392900",
|
|
"#FFFFCD", "#FDFEAF", "#FCFBA1", "#FDFF69", "#F9FF2A", "#FFFE04", "#EFEE00", "#E0DE00", "#BDBF13", "#B4AF00", "#9F9900", "#909002", "#717300", "#505400", "#4A4F00", "#343700",
|
|
"#E4FFBD", "#DFFEB9", "#D1FF8F", "#CAFC84", "#C0F96B", "#BAF353", "#98FB00", "#9AEE0F", "#78CE00", "#74C100", "#61A401", "#578A03", "#4F7E02", "#3C6200", "#2E4F00", "#203700",
|
|
"#E1F8D8", "#BBFEAD", "#A2F592", "#A1F79A", "#81FF7A", "#5DFF59", "#48FF58", "#00F600", "#12D31F", "#0ACB04", "#10A40A", "#089811", "#06780E", "#05640F", "#005200", "#003100",
|
|
"#D5FFF8", "#BCFFEA", "#A7FED3", "#99F2C4", "#6CFFB5", "#53F29E", "#4CFEA1", "#0AF779", "#0CD56A", "#0BC868", "#01AA50", "#07A557", "#008642", "#075A30", "#00562C", "#00331a",
|
|
"#D9FDFE", "#B3FCFF", "#ACFFFF", "#90FFFF", "#76FEFF", "#5FFAFD", "#08FEFE", "#22F3F2", "#06C9C2", "#08B2C4", "#049FA4", "#078C97", "#008286", "#025D5D", "#005056", "#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", "#FFB2FF", "#FF9AFF", "#F181F1", "#FB6FFD", "#F850FB", "#FB46FF", "#F91FFF", "#F900FF", "#DD00E6", "#BF00C7", "#9B0199", "#B70090", "#670362", "#4F0153", "#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> |