Show HN: ColorMe

https://tylergaw.com/articles/introducing-colorme

by hodgesmr • 10 years ago

103 18 10 years ago

david927• 10 years ago

Well done!

katabatic• 10 years ago

Very cool. One minor usability suggestion - it would be fantastic if the adjusters didn't reset when the base color changes.

thegaw2• 10 years ago

Ah, yes! I had it set up like that in the beginning, but turned it off because I wasn't sure what the expected outcome was. Can flip it back and add a "reset" button for the Adjusters. Thanks for the feedback.

Walkman• 10 years ago

A color picker for the base color would be handy

leepowers• 10 years ago

I love the design and layout of this app. Very nice!

A killer feature would be add options to calculate complementary, monochromatic, analogous, etc. color harmonies, similar to a color calculator:

https://www.sessions.edu/color-calculator/

zhte415• 10 years ago

Nice. A color app is a way I like to get used to controllers in MVCs, this takes that in a new direction.

91bananas• 10 years ago

You have any examples? I've always thought a todo app was too lacking, but haven't thought of a good slightly tougher example

BafS• 10 years ago

Nice job. Adobe Color (https://color.adobe.com) is also a similar tool.

ge96• 10 years ago

Curious if there's a reason Disqus is the main comment app. What about Facebook/other social media? I was thinking of bundling them together perhaps mix results.

Also I like the design/style of the site though I think white text on black isn't a good practice eg. Harder to read due to contrast. That's just my opinion though and not backed by anything, I'm not an expert designer just my opinion.

sjroot• 10 years ago

This is great. My only thought is that it is nearly impossible to adjust the sliders on a mobile device.

joekrill2• 10 years ago

It's not immediately evident, but the numbers are actually inputs, so you enter values directly.

thegaw2• 10 years ago

Hey, thanks for the feedback. Thought the same thing. I released an update for them a few minutes ago https://github.com/tylergaw/colorme/pull/4

I've been using it on an iPhone 6 and it's better. I still miss and get the horizontal slider from time to time, but feeling better now. What do you think?

Freak_NL• 10 years ago

It looks neat, but I have a subtle suggestion; why not output CSS HSL colour codes instead of RGB? It's supported in all relevant browsers (IE9+).

HSL has the benefit of explicitly showing the colour's hue, saturation, and lightness — meaningful values compared with RGB's three colour channels, which is something you might want to stimulate with a tool like this.

With HSL a minor change in saturation or lightness can also be done directly from the CSS (or SASS) code by whoever is maintaining the stylesheet.

    # Green.
    hsl(130, 41%, 33%)
    rgb(50, 119, 62)

    # Slightly more vibrant green — note that only the saturation value changes.
    hsl(130, 53%, 33%)
    rgb(39, 130, 55)

crestfallen• 10 years ago

I did a big survey of site stylesheets a while back and HSL use in practice is super, super low. I'll see if I can dig up that old spreadsheet.

And that's the reason I love your suggestion. With some browser support reassurances to the user (HSL is safe to use!), a neat tool like this outputting HSL could help the HSL adoption rate. HSL is pretty nice to work with, so I'd love to see more of it.

DTrejo• 10 years ago

a bunch of useful color links I've accumulated over the years:

tools

* https://dtrejo.com/colorslice/ - I made this b/c i wanted multi-color picking and good schemes from images and husl and multiple editable color formats

* http://speculo.co/ - preview colors on layouts

* http://tools.medialab.sciences-po.fr/iwanthue/ - colors for data scientists

* https://color.hailpixel.com/ - fun color picker

* http://tristen.ca/hcl-picker/#/hlc/6/1/20313E/EFEE68 - hcl picker

formats

* http://www.hsluv.org/ - human friendly hsl

a11y

* https://www.randoma11y.com/#/?_k=nm2tko - check color a11y

* https://snook.ca/technical/colour_contrast/colour.html#fg=33... - contrast checker

tribby• 10 years ago

I would add Color Safe[0] to the list -- for creating accessible palettes. I think it's a project of LinkedIn.

0. http://colorsafe.co/