开发者

An algorithm to create the same array of contrasting colors each time?

For my program I am trying to create a function that will generate an array of colors (should be the same each time so no randomness) where each colors is much different from the other colors.

Why might you ask? Well, because the user can add custom items to a user control and with the addition of each item the item should be associated with a specific color.

Obviously this would be bad:

Red
Dark Red
Light Red
Pink

Because visually all of these are quite similar in tint and color and the user would not be able to differentiate them. Ideally the function would yield something like this:

Red
Dark Green
Light Cyan
Orange

In this case each color is much different from the other colors and the user can easily tell them apart visually.

However, I'm having a bit of trouble coming up with an algorithm that does this. I know I want to use Color.FromA开发者_运维技巧rgb but I'm not exactly sure how to construct the loops where each item is much different from the others yet it is the same each time the function is ran. The modulus operator might be helpful.. I have been messing around with different approaches but each there is always a color too similar to another color in the array. I want to do it with a loop but that seems to kind of imply a pattern and a similarity in either tint, hue, or brightness between all the colors.

I suppose I could hardcode a ton of values but I'd really rather not.. =X

Well, if any of you have an idea please let me know! Thanks!!


Using the Rich Newman's HSLColor class, you can use code like the following to generate even steps around the color wheel. For more detail, see his posts, starting with part 1.

private void button1_Click(object sender, EventArgs e)
{
    listView1.Items.Clear();

    int step = 240 / comboBox1.SelectedIndex;

    for (int i = 0; i < 240; i += step)
    {
        HSLColor color = new HSLColor((double)i, 240, 120);
        listView1.Items.Add(i.ToString()).BackColor = color;
    }               
}

This would produce colors as shown:

An algorithm to create the same array of contrasting colors each time?

An algorithm to create the same array of contrasting colors each time?


There may be a really cool method for this, but if nobody turns one up, you can probably brute force it easily enough. Something you can try is to just space the RGB values out as much as possible. The one downside is that you will probably get some garish colors. I think you can get around that by offsetting a bit but you'll need a bit of testing.

For example....

8 widely spaced colors could look like this. Note that D0 and 50 are 80 apart or as wide as you can get in an 8-bit space but give different options than 00 and 80, which IMO are horrible colors.

D0D0D0
50D0D0
D050D0
D0D050
5050D0
50D050
D05050
505050

If you need more colors, you can make the interval smaller. All permutations with 3 8-bit values instead of 2 for each word would give you 27 variations (3^3) which should be enough in most cases. In that case, space your numbers about 55 (hex) apart from each other. 4 8-bit values goes to 64 colors (4^3) which certainly will do.

The only other problem I see is that some of the darker colors will be hard to distinguish so you may want to cheat your values towards the lighter end. But I think instead if you simply skip the darkest color (which will be dark gray) the others should all work and be distinguishable relative to each other.

The algorithm to generate the colors should be fairly simple once you decide which values to rotate among the three words.

Final Note: I reiterate that this is quick and dirty and I defer to any existing method that someone can point to. Just trying to give the OP an option that might be sufficient.


If you rather not hardcode the values, forget RGBA and look how hue affects the color in a HLS or HLV color space.


Here is a bad way to do it: take the numbers 0, 1, 2, ... and turn them directly into RGB values. This is bad because the first numbers up to 2^n-1 are different in only the low order bits of the B component.

Here is a better way to do it: count from 0,1,2.... as before, but re-order the bits after counting, so that the low order bit is the high order bit of R, the 2s bit is the high order bit of G, ... the 8s bit is the 2nd highest order bit of R again, and so on. Now if you generate e.g. 2^9 numbers to 24-bit RGH values, any two numbers must be different by at least 32 in at least one component.


The question is essentially the same as Generate distinctly different RGB colors in graphs

In my answer to that question, the code solution is for the color division and element patterning, is given.

But, in reality you are better off with the list. Though processor intensive, you can generate such a list using great color distance formula like LAB with Delta2000 distance metric start from black and select an absurd number of random guesses (20k) and get a very nice list. And you'll end up with much better distinct colors than you can get programatically (especially considering how quickly the colors start to hit anyway).

Left to right, Top to Bottom.

An algorithm to create the same array of contrasting colors each time?

#FFFFFF
#FCFD0C
#FCA4FA
#09DAFC
#D86606
#03883F
#153CFD
#AB0344
#00FBB4
#F9D2C0
#5D4C01
#7D7B86
#0D5252
#A29204
#188EF7
#370257
#F4717C
#D90DCB
#9BB2A1
#7F2B00
#6DC50B
#B8CBFB
#034204
#058E9E
#534049
#FEA912
#F3FDFB
#977DEA
#06335A
#E60E1F
#676E58
#2F0102
#E3FEBC
#725493
#A9937C
#926455
#FDE5FE
#03669E
#B579A0
#382000
#0BB687
#930177
#D8C37C
#FE966F
#3D3E2E
#A0F8ED
#9D6B06
#63760A
#B5AAB6
#ED167D
#879D5C
#001C07
#117B6B
#EFAFBB
#90556F
#83ADC0
#22172C
#516B73
#1BB8B6
#5B0036
#9102CC
#0B0AB0
#03FC4E
#700717
#01252D
#B48B8A
#CEC8B8
#798A86
#96CB8B
#FD5AC2
#BAC500
#41474F
#6572A7
#6A5F58
#C48B47
#C0525B
#A45211
#AE9FD3
#FED019
#D06E55
#C0F85A
#3E4F9B
#2F613F
#603D2E
#877150
#BCEBFE
#619376
#D96DFA
#1C6CFE
#5A3161
#02B1FA
#08AB3C
#016800
#A81C1F
#9C4AFE
#E6B380
#85A1FB
#CBE7D1
#455315
#723542
#00073A
#9072AD
#32211F
#5E5E74
#28DCC1
#FEF2CC
#A7539A
#C4CDD5
#175066
#764910
#FE4209
#8C8B6F
#0AD36D
#8091AB
#FC8A26
#533391
#91CACA
#A1A29E
#4B9002
#1D3F2E
#404060
#F8F08E
#2E82AA
#D2A716
#EB88B0
#7C6C1B
#201C07
#F1E6E5
#D6A593
#7E676E
#DFC4FA
#03727A
#AB9C63
#88A301
#BF0172
#FE0E55
#695BD0
#283104
#65814C
#1A988C
#531A02
#CFA4C6
#AA744D
#B6BD91
#485A51
#8B7C75
#614F34
#A9F5BE
#A66D76
#9B879A
#8BCEFE
#03B0CA
#BFD579
#232730
#858440
#72A3A2
#CD4302
#17E4E7
#88463D
#FE9A92
#6B516E
#161F70
#B5513D
#2F002B
#C899FE
#44202D
#80C4A6
#58776E
#D46483
#880D4B
#68017C
#A3AEC4
#C286CC
#E2E5FC
#BEADA5
#1C241F
#678F9E
#9456BC
#2C4142
#413508
#CD003B
#FDC3E9
#EFCED2
#B28405
#45382D
#FD4D48
#FDD8A3
#98ED83
#72736F
#02081D
#8E6D8A
#AFB357
#6D82DF
#65A86D
#D38251
#B40AA5
#D1539E
#BA62C5
#302451
#735054
#676339
#833697
#1A010A
#C5B08D
#0637B8
#5404DE
#C1DCDB
#B84E71
#189BC6
#FD17F3
#5B310A
#447B59
#8A5E39
#036E8B
#7D3A66
#0C9969
#55091F
#FE7331
#AA340A
#FCC465
#496C32
#BF8772
#9D8145
#687888
#1A57D8
#D5C9D9
#787394
#A19291
#0D78CD
#A6A58C
#8EF1FD
#3C4D2F
#5C6064
#95595B
#C57675
#0A4C7E
#4ED49D
#93BC5C
#BF7103
#006151
#A1B9BA
#ADAAFD
#C9A8AB
#4E2521
#FEBBAF
#0AFEEC
#D3015B
#F97A66
#DA9099
#54044F
#78E800
#558A88
#5DAB98
#94959E
#D5DFB6
#766AFD
#7E5B06
#595846
#4F6480
#F4FDE6
#869A7F
#5DA9FD
#8F8BB2
#7A2EFC
#B709E6
#012C28
#BEBCDF
#FE7AF0
#D50D9A
#E1D052
#FDE9D5
#203A49
#5F610A
#67A72B
#402E45
#1C1003
#894928
#022C07
#860203
#321201
#748B0A
#3B7B0B
#DE8D01
#6B42BA
#FE4D98
#943A58
#CDE70C
#CAA35D
#D6FEF9
#FEBA97
#80FBD7
#6B8168
#B9AC0B
#CD38FC
#5A535A
#BDC8B3
#8A9BA1
#745748
#8BCBE0
#A53F48
#2D2926
#555584
#067138
#11D92D
#5E324A
#6B99BC
#3AC0EC
#CC9873
#F906B8
#17233D
#FBA467
#BB6237
#8E8B84
#313A75
#7D082F
#396762
#957C00
#957A7F
#549349
#5C4A45
#A3D424
#722D1E
#9491D7
#8CB18A
#487C89
#DBEDFD
#280318
#4A0202
#53C7D3
#A1DAC9
#450487
#021A2A
#020157
#A1796C
#7A7650
#BF8EA2
#3B3845
#FEA3D5
#484723
#DBCEA7
#004C29
#CBC4C4
#AD8EB7
#7E6EC1
#DAB9A0
#64BC60
#AACBA9
#FDDB80
#AD67EC
#AB6188
#6D0AAA
#1D0832
#24301E
#4F4D49
#38585D
#394C64
#94B8DC
#D64D47
#911C2C
#426AB2
#2EA1A7
#D7DDD4
#03F385
#B1685C
#2C581E
#721757
#6BC8BB
#955902
#FE4879
#874B85
#CFA4E5
#471C3D
#E1F790
#E584C9
#C1FEE1
#95983E
#DDBBCE
#08BEA6
#506A55
#FBF7EA
#837C6B
#6F696F
#524077
#583D05
#9A7E65
#49236C
#A382CC
#B7BDB8
#816B5D
#6860A7
#0C8281
#466700
#B4D1E8
#DFDB9A
#308B71
#A33582
#2B232B
#5E82A8
#F5B70B
#716853
#657138
#059AE1
#E9A24F
#FE7198
#D98F84
#BBE4A7
#CC0300
#7C868D
#A3A0BA
#B09062
#755F36
#02BD0A
#729488
#573439
#F6E108
#544A5E
#D45433
#78DE90
#C0AC55
#42291C
#776287
#4B738D
#011315
#DD6CD3
#868303
#DA6EA3
#024149
#393D3A
#120B15
#E15964
#525F39
#D88029
#455966
#6F7B70
#909B90
#03B668
#B19387
#FEFDBD
#AF6624
#DDCBBF
#0B6070
#0C7051
#DD3F68
#A67C8D
#5F6C68
#4C361B
#7B82BA
#FE95AB
#92D659
#F3F5FD
#049625
#8AE0BA
#606ED6
#986F3D
#B94586
#B1933E
#2F5548
#AA6BA8
#5DA1B1
#9AA67C
#647B7E
#74465A
#C03231
#9F593B
#714A2D
#080F00
#465BF9
#708E3F
#E0BBB3
#DD6937
#9EB92D
#423A3B
#666E87
#8D5F9D
#003C90
#B39BB0
#AFB0B5
#ACCABE
#E4BF4C
#382F19
#6CBF86
#74687B
#84B7AD
#AFE5E3
#040082
#4B4BC2
#D3F8CE
#FB0739
#709262
#E0D6F8
#C1CAE1
#91A3CE
#C6BCFC
#798099
#2B384F
#02A487
#8A8EFD
#0D58AC
#8E3620
#3B483B
#78B6C0
#464300
#BC80FD
#E1A6A2
#9C38B9
#938360
#171C01
#337FFC
#C07B8A
#762F74
#843F01
#E08465
#CC972B
#C4B1D0
#5CABD1
#F96642
#B5AD9E
#455050
#87FEA7
#3E011B
#F3FB6B
#6D3935
#243033
#939260
#2C4100
#223E19
#805F5B
#498B5C
#A4B7C4
#5B4C9B
#BDB27D
#401B4C
#56A781
#B449B9
#D7DE65
#210A01
#8861DD
#FBCCA6
#6B213F
#8749D6
#DC9CB5
#95FE62
#E1E0C7
#C78CB7
#002155
#0D0828
#467E3B
#9B7BA1
#877889
#5F92F9
#C7FE96
#4B31B7
#302317
#8F712C
#8F8B9F
#A1B26F
#DE8EF0
#19413D
#AE7B30
#A39778
#F8EDFA
#66515D
#642429
#009D50
#3F2C33
#7D855A
#C25703
#F8C0FE
#694578
#FD2720
#4A4E60
#926E54
#5C734D
#7EA893
#8CA2B6
#A992F6
#844851
#CBC972
#7E5E74
#DBF8FE
#2B2894
#4F4736
#098458
#DE6F67
#302D45
#FEEAAB
#F38C50
#2E1218
#9C2365
#563E5B
#0C87CD
#002D1C
#B13759
#F6A690
#3A637C
#996CC9
#7550FB
#6CE4D7
#CB6CB3
#004D3B
#558472
#DC9458
#946D6B
#926777
#DC4ACC
#4B3632
#B18666
#C3A38A
#BA77DA
#935C86
#FEC8D9
#85AF6A
#67FEFD
#E0C08D
#81897A
#744C44
#AAB5E1
#BEB99C
#D3BEC0
#FC970D
#E6CEB1
#8E8287
#A8C9D4
#880090
#6E5D5E
#3D8DA7
#62625C
#83E2FD
#E3AC43
#A0998B
#998836
#8B3141
#3A6E5C
#E09DD6
#021A14
#515EB8
#2C2D16
#B5CD8F
#696691
#BF7739
#B67459
#DB354C
#191B1B
#8CA4A1
#A7524C
#E15000
#D4BD03
#7592C5
#650A01
#AC4FDC
#D6E3E6
#6BDA66
#A14134
#A296A2
#58541B
#A6ADA0
#EACCEC
#7A6148
#201450
#32182C
#6D371B
#9E1702
#02E8B8
#B3E3C0
#5E7F2C
#93AA49
#B14D22
#677075
#DCDAE1
#02D2C9
#786E6A
#9D9F03
#662D82
#01AC9E
#097821
#F1740F
#CDE0FE
#F3FED2
#77761E
#3F3E9A
#0274A4
#BDBBC9
#6E5C05
#BD6271
#924BA0
#263930
#E8A17D
#C38001
#437879
#79DBDF
#FDBA6E
#E72800
#FCE1DA
#46355D
#DF7A8C
#FD6CB0
#1E021E
#7C66A3
#A24471
#032ADF
#9D4D5F
#7A7D66
#7755B1
#E2DBD2
#0649BA
#30A203
#574B6F
#7CB309
#1C1C2C
#AC8F99
#5A35DD
#091018
#5C9A91
#855341
#AF1732
#6D9193
#877941
#75ECB0
#958875
#6C4F16
#5C4737
#FD109A
#56481E
#CAA375
#005F2A
#D2E49E
#415B43
#036D66
#E0F4EB
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜