2

A color can be represented as mixture of Red,Green and Blue.

Ex: (255,51,153)=pink

Is there an any good formula to get distinct colors by changing one variable? such as (10x,22x,2x^2). So when x=1,2,3,4,.... It will give separate colors like Red,Green,Cyan,Blue.....etc.

nrnw
  • 441
  • 6
  • 13
  • 1
    How do you define "separate colors"? Each RGB value is a distinct color - we just don't have distinct names for each one. – mbeckish Oct 02 '13 at 17:07

2 Answers2

2

Perhaps you'd be more interested in using HSL/HSV colors. Define the saturation and lightness and adjust the hue to get different colors. Check out the HSL and HSV wiki to learn more. A 15 to 30 degree adjustment of hue will result in a distinctly different color without messing with saturation or lightness.

An example of hsl in CSS is as follows. 

<h1 style="color:hsl(0,50%,100%);">HSL Test</h1> //this will be red

The first value at 0 is red and advancing by 120 degrees will bring you to green and another 120 will bring you to blue and the last 120 will bring you back to red since the degree system is based on the 360 degrees of a circle. So 0 and 360 are the same just 60 & 420. The next two values are percentage based from 0% to 100% to define the intensity of that property. They're hard to explain so I made a quick fiddle that demonstrates this.

So to answer your question there is a good formula to adjust color it just depends on how exactly you want to change it. In the RGB world you can make things darker by lowering values uniformly and the opposite by heightening them. You can increase the different color presences by adjusting the individual color values as expected. However if you're trying to cycle the entire color wheel then this is difficult (although entirely possible) using RGB values. The real lesson to take away is that there are a number of ways to define a specific color and with each one different ways to traverse the spectrum. HSL and HSLA are very intuitive for many people since it's values don't really have to be guessed at. Pick a specific hue off the color wheel, Remember ROYGBIV as you imagine a value from 0-359. Define a saturation based on how bold you want the color to be and then a lightness based on how bright. It's far more useful then RGB in the large majority of cases as you'll see in that fiddle. Making a subset of the entire color spectrum with javascript only takes a few lines of code.

Community
  • 1
  • 1
rfoo
  • 1,160
  • 1
  • 12
  • 27
  • You're very welcome, when I learned about HSL and HSLA (<=that's with transparency) it blew my mind and now I use it constantly! It's excellent for basically everything besides a quick short hand color like white or black, and legacy browser support. There are ways to get around that though so don't fret too much. – rfoo Oct 02 '13 at 18:30
1

There is a similar question here

This javascript library can help you Name the Color Javascript Lib

A Demo of the library

Community
  • 1
  • 1
Diego
  • 916
  • 1
  • 13
  • 36