Find Your Color Scheme | Hacker News Reader

Find Your Color Scheme

colourco.de

235 pointsscottkduncan45 comments

Nice. It's a similar interface to what hailpixel (Devin Hunt) built:

http://color.hailpixel.com/

The scroll bar on that site is a cool way to represent the saturation. Scrolling with the mouse wheel changes saturation on http://colourco.de/ too, but it’s more obvious on the hailpixel site that you can use the mouse wheel.

Do either of these "intelligently" pick colors? Just playing around with them, it seems I can't make anything ugly.

http://en.wikipedia.org/wiki/Color_scheme#On_the_color_wheel

Part of color theory.

I prefer this site. clearer and simpler, focus, than http://colourco.de/

Try code mode.

Sort of, but providing the scheme progressions is really neat.

any idea how this guy calculated the colour for the text dynamically so as to maintain the contrast difference?

I'd be mildly interested in seeing a slightly different kind of tool: generating color schemes for sci-fi illustrations. Bear with me here:

If you look at this gallery, for example: http://www.thomlab.com/gallery.htm , you'll see that many of the paintings follow the same way of picking emotionally appealing colors. Firstly, there's a really dark foreground color used for some objects that are extremely close by, at the edges of the frame, like a "door jamb" to guide the viewer inside. Then there's a lighter color for the midground (is that a word?) and a still lighter one for the distant background, like the sky, to hint that the pictured world is huge. Can we get a tool that generates triples of colors suitable for this?

This was very cool, but it needs a simple change, it needs a way of changing the text color independently of the background color. Perhaps holding the mouse button would be text color preferred and not holding it would be background preferred or something.

That said, I would love a page that had some ipso-lorem type code C, Perl, js, C++, Java, Etc where each click would change the 'type' of element (keyword, comment, etc) and you could mouse around to set the color. Then right click and download the vim color scheme.

There is a custom syntax color theme maker for Visual Studio here: http://studiostyl.es/schemes/create. Its user interface is pretty close to what you’re describing. And there might be some way to convert Visual Studio color themes for use with other editors.

However, that page is not very good for creating dark-background themes. It’s missing a bunch of styles that I saw fairly often in C# code, and their default light colors look awful on a dark background.

i would love to see this applied in a sort of CSS zen garden way where a simple layout's color scheme is updated continuously based off of moving your mouse around.

I would love for it to stay as simple and barebones as it is and not accrete crufty features such as applying the color theme to vacuous stuff like a generic layout on generic text/code, that is not representative of where I will use it anyway, and it won't know which color I'll use for what.

    fswatch ~/Downloads "mv ~/Downloads/colorscheme.less /somewhere/else/with/assets && firefox -remote \"openURL(127.0.0.1:3000/whatever, new-tab)\""

Bam. My layout, my content.

[0]: https://github.com/alandipert/fswatch.git

[1]: replace fswatch with inotifywait on linux

[2]: I actually use shell-wrapped AppleScript to remote control Chrome from the command line.

[3]: also rb-inotify, rb-fsevent, rb-fchange gems (the last one is for Windows)

At first, I was a little bit thrown off by the mechanic of changing the color by moving your mouse. But then I realized its brilliance: it lets you compare different color schemes ridiculously fast. Very handy.

A bit of feedback: it seems that there is only two dimensions of changing the base color, corresponding with the two dimensions in which you can move your mouse. I can also see by the text overlay that saturation is locked in at 50%. It'd be nice if we had control over saturation. Maybe with a slider?

In the code mode, you can change the saturation with the mousewheel. For some reason, it changes the lightness in scheme mode. I'm not sure if it's intentional or a bug.

This is AWESOME. My personal website looks like this[1] and I've wasted insane amount of time to get the color scheme right. I still think it's terrible, but I went with the scheme I was most comfortable with. This website will help me a lot to decide (plus it has 5 different palettes/stripes, just like my website) on the perfect color scheme. Thank you so much for your work (assuming OP is the creator of the website).

[1]http://cl.ly/image/1C413p040J0R

Nobody has mentioned it yet, so I'll mention https://kuler.adobe.com/ .

I am completely unable to coordinate colors. And algorithms (``on the color wheel take 12 o'clock, and 5 and 7'') are very limited. What I find useful is a site where people who are into this kind of thing contribute their work and I use it, with grateful acknowledgement.

Kuler is best used inside Photoshop and Illustrator. To those who don't know, it's natively supported (see: Window->Extensions->Kuler).

http://www.colourlovers.com/ is another good one, though somewhat bloated.

rgb(#, #, #) shows up twice per box. For instance:

   #c65e54
   rgb(198, 94, 84)       // RGB here
   hsl(5, 50%, 55%)
   hcl(32, 48%, 53%)
   rgb(198, 94, 84)       // and here again

I wish it worked on the iPad. I tried it and couldn't figure out how to use it until I read the comments here about using a mouse. Sounds like it would be easy enough to catch the touch events instead of the mouse.

As much as I'd like it to work on my iPad too, I still just view it as a toy and not something that can be productive.

Really cool. What would make it perfect is if you could go back and tweak colours you've already added. Bookmarked in any case. Consider my suggestion a feature request!

Here's something I made for fun a while back: http://codepen.io/uniZero/pen/JueoL . It generates a color scheme using SCSS & Compass so you can see the changes on your site more immediately. It's really noob and basic, but it makes you realize how much more convenient using SCSS to handle color schemes is. Just play with the $magic-color variable to see new color schemes.

This is great!

You should remove the shadows, or provide an option to turn them off perhaps. It might give a better view of how the colors play with each other.

It's funny, I was just thinking that I really like them--so many sites use drop shadows that they provide some information as to how those would look.

That's really cool for 'artistically impaired' people, too. I couldn't find even two matching colors if my life depended on it.

Less saturated ("pastel") colors match a lot easier. At some level of saturation any combination matches just fine. Try it yourself ;)

In case it happens: black and white. You owe me one.

this is very nice, impressive at first glance, and very useful when studied some more. here a few more useful sources for designers, front-end developers, illustrators and learners

http://colorschemedesigner.com/#

http://labs.tineye.com/multicolr

This is supercool.

Here's a question: I'd love to take my print copy of Albers' color theory stuff and record some of the color codes, maybe just by eyeballing the screen and then the page. What's a good way to calibrate my monitor so what I'm seeing is close to universally "correct"?

You need one of these http://spyder.datacolor.com/display-calibration/

thanks for the feedback. many of the bugs I had not noticed before

Is it possible to start with a single color and get a suggested color theme? If not, please consider that a suggestion. I often spot a color I love from someplace else and then struggle to select complementary colors around it.

I have a tool written mainly for myself cause i'll hate adobe kuler for using flash and wasting a lot of screen-space. I will continue to improve this tool, and push it on github or bitbucket, so then everyone can view and improve the code. Bug Tracker/Feature requests: http://dev.zaku.eu/colourco.de/issues

I would love one of these built around mood or word association. There's a million combinations that look fine to me but how do I know if they are right for my customer?

EDIT: Spelling

http://www.colr.org tries to do exactly that.

Try searching for "autumn" or "forest" or "shrimp"

Looks like you forgot to buy the American spelling. Got your back bro.

http://colorco.de/

http://colorizer.org/ is another nice tool in this area.

That's awesome! I always get confused about my color scheme. Going to use this for my every project.

Awesome. That said, it'd be even better with a small color key you could toggle on the top right.

This is great. I see myself spending hours here in the future.

thats awesome ! how did you calculate teh colors for the text so that they remain visible?

This is great. Thanks!

Cool!

Thanks!

Reply on news.ycombinator.com