生成颜色列表,从蓝色到红色,从 0% 到 100%

发布于 2024-09-18 01:23:01 字数 90 浏览 6 评论 0原文

我想创建一个颜色列表,红-黄-绿-蓝,并在 100 种范围内相互混合。有人有这方面的经验吗?

编辑:嗯,实际上是RGB。任何语言都可以。我只需要算法。

I want to create a list of colors, red-yellow-green-blue, and blend into each other across a span of 100. Anyone have experience in this sort of thing?

Edit: Well, RGB actually. Any language will do. I just need the algorithm.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

吻泪 2024-09-25 01:23:12

3 个嵌套循环。
在 R 上从 1 到 n 循环一次
g 从 1 到 n 循环一次
在 b 上从 1 到 n 循环一次

应该会给你 3^n 左右的颜色 -

3 nested loops.
loop once on R from 1 to n
loop once on g from 1 to n
loop once on b from 1 to n

should give you 3^n or so colors -

小瓶盖 2024-09-25 01:23:11

这样就可以了,给出大约 1600 万种颜色。

int[] colors;

for (int r = 0; i <= 255; i++)
{
    for (int g = 0; g <= 255; g++)
    {
        for (int b = 0; b <= 255; b++)
        {
            colors[] = rgb2int(r, g, b);
        }
    }
}

rgb2int(int red, int green, int blue)
{
    return (red << 16) + (green << 8) + blue;
}

This should do it, giving all 16-million or so colors.

int[] colors;

for (int r = 0; i <= 255; i++)
{
    for (int g = 0; g <= 255; g++)
    {
        for (int b = 0; b <= 255; b++)
        {
            colors[] = rgb2int(r, g, b);
        }
    }
}

rgb2int(int red, int green, int blue)
{
    return (red << 16) + (green << 8) + blue;
}
掩于岁月 2024-09-25 01:23:10

使用 HSV 颜色空间作为您的颜色(红色为 H=0、S=V=1,蓝色为 H=240、S=V=1),对色调值进行线性插值并将其转换为 RGB:

http://en.wikipedia.org/wiki/HSL_and_HSV#Converting_to_RGB

Use HSV colorspace for your colors (red is H=0, S=V=1, and blue is H=240, S=V=1), interpolate linearly over the Hue value and convert them to RGB:

http://en.wikipedia.org/wiki/HSL_and_HSV#Converting_to_RGB

生生漫 2024-09-25 01:23:08

简单的嵌套 RGB 循环不会生成红-黄-绿-蓝渐变。如果这确实是您特别想要的,那么您应该对色轮有所了解:

                    red
                     |
           magenta__ | __yellow
                    \|/
                  __/|\__
              blue   |   green
                     |
                    cyan

这实际上是一个 HSV 色轮,非常适合理解加色。根据这一点,通过混合红色和绿色可以得到黄色。因此,对于渐变:

// in javascript:
function cssColor (r, g, b) {
    return 'rgb('+r+','+g+','+b+')';
}

var colors = [];
// Start with solid red:
var r = 255;
var g = 0;
var b = 0;
// From red to yellow:
for (var g=0;g<=255;g++)  colors.push(cssColor(r,g,b));
// From yellow to green:
for (var r=255;r>=0;r--) colors.push(cssColor(r,g,b));
// From green to blue:
for (var b=0;b<=255;b++,g--)  colors.push(cssColor(r,g,b));

这将为您提供 768 种颜色的数组。如果您使用每八种颜色,您应该获得大约 100 种颜色的数组:

var subColors = [];
for (var i=0;i<colors.length;i++) {
    if (i%8 == 0) subColors.push(colors[i]);
}

无论如何,利用这些知识,您可以获得您想要的任何渐变。

A simple nested RGB loop would not generate your red-yellow-green-blue gradient. If that is really what you specifically want then you should know a bit about the color wheel:

                    red
                     |
           magenta__ | __yellow
                    \|/
                  __/|\__
              blue   |   green
                     |
                    cyan

This is actually a HSV color wheel that works very well for understanding additive colors. According to this, you get yellow by mixing red and green. So, for your gradient:

// in javascript:
function cssColor (r, g, b) {
    return 'rgb('+r+','+g+','+b+')';
}

var colors = [];
// Start with solid red:
var r = 255;
var g = 0;
var b = 0;
// From red to yellow:
for (var g=0;g<=255;g++)  colors.push(cssColor(r,g,b));
// From yellow to green:
for (var r=255;r>=0;r--) colors.push(cssColor(r,g,b));
// From green to blue:
for (var b=0;b<=255;b++,g--)  colors.push(cssColor(r,g,b));

This give you an array of 768 colors. If you use every eighth color you should get your array of around 100 colors:

var subColors = [];
for (var i=0;i<colors.length;i++) {
    if (i%8 == 0) subColors.push(colors[i]);
}

Anyway, using this knowledge, you can get any gradient you want.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文