Color Theory - calculating complementary colors

They have: 447 posts

Joined: Oct 1999

I've now spent over 2 hours searching for what i thought would be easy to find on the internet. What i want to do, given a starting color as RGB values, is calculate the complementary, split-complementary, and triad colors. Does anyone know the algorithm to calculate a color wheel? I've found plenty of informative links regarding color theory, but nothing regarding doing the actual calculations.

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

Interesting... a number of sites have popped up over the years talking about colour picking, color blending and harmonizing, perhaps they would help you out?

http://www.easyrgb.com/harmonies.php
http://www.meyerweb.com/eric/tools/color-blend/

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

Try this one:

http://www.webwhirlers.com/colors/wizard.asp

It works with hex values though.

I know I've seen one that works more like a colour wheel before but I can't remember where. Try digging through old threads on color schemes - I probably came across it in there somewhere when I was looking at those a couple weeks ago.

mmi's picture

They have: 457 posts

Joined: Jan 2001

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

I woke up this morning yelling - physics! I can't believe I didn't think of this earlier. *smacking head*

Anyway, if you're looking for calculations, there seem to be a plethora on how to translate between RGB, CMYK, HLS, et cetera, but not much on complementary, tertiary et cetera calculations:

http://www.physics.sfasu.edu/astro/color.html

http://www.glenbrook.k12.il.us/gbssci/phys/Class/light/u12l2d.html

http://www.physics.sfasu.edu/astro/color/spectra.html

***

software applications:

http://www.color-wheel-pro.com/

***

http://www.amazon.com/exec/obidos/ASIN/0471021067/qid%3D959246102/sr%3D1-1/002-9088067-7816861 (only $250+ for the hardcover -- eep!)

Fascinating stuff. These pages were very interesting, one has an algorithm, but not for the complex calculations, perhaps you could contact the author and adapt it?

http://homepage.tinet.ie/~musima/colourtheory/colourtheory.htm

http://www.interlacken.com/rfp2000/colorpik.htm

http://www1.tip.nl/~t876506/ColorDesign.html <-- goes into how to calculate, but no algorithms

They have: 447 posts

Joined: Oct 1999

Thanks for the replies all.

Megan, the link you posted (http://www.webwhirlers.com/colors/wizard.asp) is exactly what I want to do, but I don't want an application that does it for me, I need to know how to do it for myself.

For a little background, which I shouldve included in the first post:
What I'm doing is creating this website/application which allows users to customize their display preferences to an extent. To an extent means font faces and colors, not layout.

So basically the idea is the stylesheet is a php file (ex: ) which is just a standard stylesheet other than color values are replaced with user preferences (ex:

<?php
echo $userpref['textcolor']
?>
).

Anyways, while doing all of this, I though to myself "Why make the user pick 15 different colors when I know colors can be choreographed programatically (which i know because i have programs which do it for me)?". So rather than make them manually figure out a working color scheme from scratch, i want them to simply pick their favorite color, and determine a color scheme for them based on that color, then allow them tweak it to perfection.

That said, I havn't reviewed the links in the last couple of posts yet, so an answer may have already been posted. Thanks again for the responses.

-Rob

They have: 447 posts

Joined: Oct 1999

Suzanne - strangely when i think physics i definately do not think color. thanks for the links which at a glance seem fruitful, although i dont have time to go through them in detail tonight.

i don't so much need working code as much as the the mathematics behind it, is it just me or does it not seem this information would be easy as heck to find?

mmi - on the link you posted 6/10 results were already visited by me - i tell ya i spent hours googling for this ...

One thing i can say, and this applies to any problem you're forced to work through, is I now know 1000% more about colors and color theory than i did 3 days ago. Yet, being a near color expert, i still don't know how to calculate the damned complimentary color of blue Smiling

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

I hope you find some. Some of the articles I linked looked very promising, lots of calculations in the middle of the discussion, so you may need to put it together a bit.

Sounds like a really interesting application, I'll look forward to seeing it when you've got it all sussed out!

mmi's picture

They have: 457 posts

Joined: Jan 2001

Hey again

Mmy oldest brother was educated as a nuclear spectroscopist. I'll ask him if he has any ideas. Unfortunately, he has an annoying habit, when asked about stuff like this, of shrugging his shoulders and saying, "I dunno." Roll eyes

I'd think about contacting ol' Doc Burton out there in Nacogdoches, assuming he's not on vacation somewhere.

http://www.physics.sfasu.edu/astro/

I'd recommend using the Insufferable Encumbrance if ya wanna surf that site--with the usual assist from Billy's Broken Glass Machine, it managed to crash mmy Mozilla browser ... twice. Mad

I threw out another net. Ya might wanna check out the haul if you're still fishin' when you're done gutting the other links (assuming you haven't already landed all these and tossed 'em back).

http://www.colorschemer.com/online.html

and its cohort:

http://www.colorschemer.com/funcs.js

http://cyber-gish.com/harmonic_colors.htm

http://www.coloracademy.co.uk/Subjects/Math/Math.htm

http://csd.velmez.net/

http://www.webthang.co.uk/tuts/tuts_graphics/graphics1/colour3.asp


Web Xpertz Community Forums for Webmasters & Developers

Where You Can Learn, Advise, and Have Fun in the Process

Mark Hensler's picture

He has: 4,048 posts

Joined: Aug 2000

You may or may not know that the Albert in my alias, Max Albert, was taken from Albert Einstein. Spent half my lunch hours my junior/senior year in high school in the math/science lab talking to my instructor. I love physics, and excell in mathmatics. (And my spelling is terrible, sorry.)

complementary = inverse

Calculating complementary colors....

a = your custome color
b = complementary color
x = max value of your numbering system (16, 256, etc)
1=red, 2=green, 3=blue
so... a1 = your custome red value, b2 = complemetary green value

b1 = x1 - a1
b2 = x2 - a2
b3 = x3 - a3

a = #336699

(using dec number system, base 256 or 0-255)
x = 255
a1 = 51
a2 = 102
a3 = 153

b1 = x1 - a1
b1 = 255 - 51
b1 = 204 (hex=0xCC)

b2 = x2 - a2
b2 = 255 - 102
b2 = 153 (hex=0x99)

b3 = x3 - a3
b3 = 255 - 153
b3 = 102 (hex=0x66)

b = 204,153,102
b = #CC9966
'

Mark Hensler
If there is no answer on Google, then there is no question.

JeevesBond's picture

He has: 3,956 posts

Joined: Jun 2002

Is this going to be an online app, Windows/Linux native, or Java?

Sorry - can't help being nosey...It's in my nature Wink
I would help if I could, but I wouldn't know where to start - apart from Google, and as said...You've tried that already Laughing out loud

a Padded Cell our articles site!

Mark Hensler's picture

He has: 4,048 posts

Joined: Aug 2000

triad colors = Rotate the rgb values (similar to rotating bits in low level programming, i386 assembly: ROL). custom=a1a2a3, triad1=a2a3a1, triad2=a3a1a2

BTW, you see stuff like this on IQ tests. Recognizing paterns and whatnot.

It's now 4am, and I need sleep. Let me know if you need any other formulas, and I'll try to find time tomorrow.

Mark Hensler
If there is no answer on Google, then there is no question.

JeevesBond's picture

He has: 3,956 posts

Joined: Jun 2002

Don't you just hate it when the answer is so simple, but it still requires a genius like Mark to tell us?

Hmmm...Well at least I can spell Laughing out loud

Mark Hensler's picture

He has: 4,048 posts

Joined: Aug 2000

Quote: Originally posted by JeevesBond
Hmmm...Well at least I can spell Laughing out loud

lol... I envy you. Stay in school, and read your textbooks! (I didn't, even through college.)

Mark Hensler
If there is no answer on Google, then there is no question.

JeevesBond's picture

He has: 3,956 posts

Joined: Jun 2002

Hahaha, It's a little late for that - I'm 22 Smiling
I got through school with good grades, but messed up college.

No, I envy you! I wasn't ever any good at maths Laughing out loud I am developing a love of the subject though - proportional to the amount of low level programming I'm learning.

a Padded Cell our articles site!

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

The answers are always simple to the geniuses. And it's a real genius that can make it seem simple to the rest of us. Smiling

They have: 447 posts

Joined: Oct 1999

hey thanks Mark

JeevesBond's picture

He has: 3,956 posts

Joined: Jun 2002

But then there are forms of intelligence, other than computational genius...Looking at your last post Suzanne (and many others you've made around TWF) you have common sense - a trait many geniuses lack Laughing out loud

Perhaps this is going a little off-topic...Sorry but I thought it an interesting subject Wink

a Padded Cell our articles site!

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

Careful now, I have a one-stroke ego! Mark's just brilliant all around. Wink If it weren't for the cheese, he'd be just about perfect.

Mark Hensler's picture

He has: 4,048 posts

Joined: Aug 2000

Ack! What's wrong with cheeeeze?!

JeevesBond's picture

He has: 3,956 posts

Joined: Jun 2002

Ummm, I might regret asking this...But what's this about cheese?

Busy's picture

He has: 6,151 posts

Joined: May 2001

you might find this site interesting favcol.com
"quest to find the web's favourite colour"

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

Mark loves cheese. Mark loves cheese. We try not to speak of it explicitly, though... *shudder*

Not that there is anything wrong with cheese loving, of course, no no, we're all open minded about these newfangled lifestyles here. Him being Californian, we have to make allowances, you know? Wink

(actually, it is related to him being from California and his love of cheese)

Mark Hensler's picture

He has: 4,048 posts

Joined: Aug 2000

Quote: Originally posted by Suzanne
Him being Californian, we have to make allowances, you know? Wink

rofl... Does that mean that we're exceptional people?

Mark Hensler
If there is no answer on Google, then there is no question.

JeevesBond's picture

He has: 3,956 posts

Joined: Jun 2002

Yeah the kind of exception which causes a GPF - arf, arf.

The cheese thing is a bit weird, but I see you point Suzanne - he is from California Wink
What's your favourite type of cheese Mark?

a Padded Cell our articles site!

Mark Hensler's picture

He has: 4,048 posts

Joined: Aug 2000

Probably your basic mild cheddar.

JeevesBond's picture

He has: 3,956 posts

Joined: Jun 2002

HAHAHAHA! OMG a website about cheese!!! Had a look at the stats as well...What is the world coming to?!

Mark Hensler's picture

He has: 4,048 posts

Joined: Aug 2000

A better place.... with cheeeze!

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

I have a hankering for a really nice aged extra old cheddar. Tangy! Then maybe later I'll have some feta on a pizza or salad. Yum.

JeevesBond's picture

He has: 3,956 posts

Joined: Jun 2002

Wow, you guys are more insane than I am - great!

Think I'm becoming addicted to this place though (can't work out whether that's a good thing or a bad thing!) Sticking out tongue

a Padded Cell our articles site!

They have: 1 posts

Joined: Apr 2010

Been awhile since this was written, but this doesn't work.

The problem is the difference between the Light spectrum and Pigment spectrum.

When determining complementary colors for web design, you're operating on the same system as decorating your house - hence the primary colors are actually Red, Yellow, and Blue - unlike the primary colors that make up the pixels on your computer screen.

Computer screens are using the light spectrum and those primaries are Red, Green, and Blue (RGB). If you want the true color wheel, you need to operate on the same system as Pigment.

Even though its nice that the complement of my favorite Green is a nice rosy Pink in RGB world, its complement should have been much closer to true Red.

For this reason, this algorithm won't really work to determine Split-Complementary and Tertiary.

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.