Creating colour schemes based on an existing scheme

Posted by Neil Barnwell on Stack Overflow See other posts from Stack Overflow or by Neil Barnwell
Published on 2010-05-04T12:18:41Z Indexed on 2010/05/04 12:28 UTC
Read the original article Hit count: 392

I have a colour scheme based around yellow, for warning messages on a website. It amounts to a slightly orange bordered box, with a pale yellow fill. The exact colours are:

  • #FED626 (border)
  • #FFF7C0 (fill)

I want to know if it's possible to convert this scheme mathematically or algorithmically somehow, to come up with a blue version where the border is the "same amount" of blue as this one is yellow. Is this possible, or do I just "pin the tail on the donkey" on a colour pallet to get roughly the right one?

I ask, because I'd quite like to be able to calculate this on the fly, to perhaps implement something in .less.

To give you an idea, I tried swopping the red and blue values on those two, and came up with this:

  • #26D6FE (border)
  • #C0F7FF (fill)

That wasn't too hard, but think about if I wanted a pink colour scheme... :)

© Stack Overflow or respective owner

Related posts about colour-pallette

Related posts about design