如何在PHP中平滑地生成颜色渐变？使用intaro/color-interpolator轻松实现

<code class="bash">composer require intaro/color-interpolator</code>

<pre class="brush:php;toolbar:false;"><?php

require 'vendor/autoload.php'; // 引入Composer的自动加载文件

use Intaro\ColorInterpolator\Color;
use Intaro\ColorInterpolator\ColorInterpolator;

echo "<h3>单次颜色插值：</h3>";
// 定义起始颜色和结束颜色（支持十六进制字符串）
$startColor = new Color('5fb8df'); // 浅蓝色
$endingColor = new Color('3b9bcf'); // 深蓝色

// 插值得到两个颜色之间的中间色（默认是0.5比例，即中点）
$midColor = ColorInterpolator::interpolate($startColor, $endingColor);
echo "起始颜色: " . $startColor->toHexString() . "<br>";
echo "结束颜色: " . $endingColor->toHexString() . "<br>";
echo "中间颜色 (50%): " . $midColor->toHexString() . "<br>";

echo "<div style='display: flex; gap: 5px; margin-top: 10px;'>";
echo "<div style='width: 50px; height: 50px; background-color: #" . $startColor->toHexString() . ";'></div>";
echo "<div style='width: 50px; height: 50px; background-color: #" . $midColor->toHexString() . ";'></div>";
echo "<div style='width: 50px; height: 50px; background-color: #" . $endingColor->toHexString() . ";'></div>";
echo "</div>";


echo "<h3>生成多步渐变：</h3>";
// 我们可以通过循环来生成一个多步的渐变
$steps = 7; // 渐变步数
$gradientColors = [];

for ($i = 0; $i < $steps; $i++) {
    $ratio = $i / ($steps - 1); // 计算当前步的比例，从0.0到1.0
    $interpolatedColor = ColorInterpolator::interpolate($startColor, $endingColor, $ratio);
    $gradientColors[] = $interpolatedColor->toHexString();
}

echo "生成的 {$steps} 步渐变色：<br>";
echo "<div style='display: flex; gap: 2px; margin-top: 10px;'>";
foreach ($gradientColors as $hexColor) {
    echo "<div style='width: 40px; height: 40px; background-color: #" . $hexColor . ";'></div>";
    echo "#" . $hexColor . " ";
}
echo "</div>";

// 示例：从红色到绿色
echo "<h3>从红色到绿色的渐变：</h3>";
$red = new Color('FF0000');
$green = new Color('00FF00');
$stepsRedGreen = 10;
echo "<div style='display: flex; gap: 2px; margin-top: 10px;'>";
for ($i = 0; $i < $stepsRedGreen; $i++) {
    $ratio = $i / ($stepsRedGreen - 1);
    $color = ColorInterpolator::interpolate($red, $green, $ratio);
    echo "<div style='width: 30px; height: 30px; background-color: #" . $color->toHexString() . ";'></div>";
}
echo "</div>";

?>