PHP Color Palette Generator
Generate beautiful random color palettes with hex codes, RGB values, and one-click copy — all powered by PHP.
PHPCSSColorsDesign Tool
Overview
Build a color palette generator that creates harmonious color schemes. Users can regenerate and copy hex/RGB values.
Main Page (index.php)
php
<?php
function generatePalette(int $count = 5): array {
$colors = [];
$hue = rand(0, 360);
for ($i = 0; $i < $count; $i++) {
$h = ($hue + $i * (360 / $count) + rand(-15, 15)) % 360;
$s = rand(50, 90);
$l = rand(40, 70);
$colors[] = ['hsl' => "hsl($h, $s%, $l%)", 'hex' => hslToHex($h, $s, $l)];
}
return $colors;
}
function hslToHex(int $h, int $s, int $l): string {
$s /= 100; $l /= 100;
$c = (1 - abs(2 * $l - 1)) * $s;
$x = $c * (1 - abs(fmod($h / 60, 2) - 1));
$m = $l - $c / 2;
if ($h < 60) { $r=$c; $g=$x; $b=0; }
elseif ($h < 120) { $r=$x; $g=$c; $b=0; }
elseif ($h < 180) { $r=0; $g=$c; $b=$x; }
elseif ($h < 240) { $r=0; $g=$x; $b=$c; }
elseif ($h < 300) { $r=$x; $g=0; $b=$c; }
else { $r=$c; $g=0; $b=$x; }
return sprintf('#%02x%02x%02x', round(($r+$m)*255), round(($g+$m)*255), round(($b+$m)*255));
}
$palette = generatePalette(5);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Color Palette Generator</title>
<style>
body { font-family: sans-serif; background: #111; color: #fff; text-align: center; }
.palette { display: flex; height: 60vh; margin: 2rem; border-radius: 16px; overflow: hidden; }
.swatch { flex: 1; display: flex; align-items: flex-end; justify-content: center; padding: 1rem; cursor: pointer; transition: flex 0.3s; }
.swatch:hover { flex: 1.3; }
.hex { background: rgba(0,0,0,0.5); padding: 6px 12px; border-radius: 8px; font-weight: bold; }
</style>
</head>
<body>
<h1>������ Color Palette Generator</h1>
<div class="palette">
<?php foreach ($palette as $c): ?>
<div class="swatch" style="background:<?= $c['hex'] ?>" onclick="navigator.clipboard.writeText('<?= $c['hex'] ?>')">
<span class="hex"><?= $c['hex'] ?></span>
</div>
<?php endforeach; ?>
</div>
<a href="?" style="color:#6c63ff;font-size:1.2rem;">������ Generate New Palette</a>
</body>
</html>Technologies
- PHP — HSL-to-Hex conversion, random palette generation - CSS — flex layout, hover transitions - JavaScript — clipboard copy
Related Projects
PHPApr 27, 2026
Analog Clock with PHP & CSS
Build a beautiful real-time analog clock using PHP for time calculation and CSS for the rotating hands and dial.
PHPCSSAnimationClock
Read more → Source
PHPApr 27, 2026
Animated Loading Spinners Gallery in PHP
Create a gallery of 10+ beautiful CSS loading spinner animations served dynamically through PHP.
PHPCSSAnimationSpinners
Read more → Source
PHPApr 27, 2026
PHP Typing Speed Test
Build an interactive typing speed test that measures WPM and accuracy, with PHP-served random paragraphs.
PHPJavaScriptCSSGame
Read more → Source
Comments (0)
No comments yet. Be the first to comment!