Show HN: ColorMe(tylergaw.com)

103 pointsby hodgesmrvor 10 Jahren18 comments

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

15 comments

DTrejovor 10 Jahren

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

mipmap04vor 10 Jahren

Excellent list - I'd like to add my own website[0] which extract color palettes from images based on predefined palettes (such as Pantone C).

[0]: www.impalette.com

tribbyvor 10 Jahren

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/

Freak_NLvor 10 Jahren

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)

crestfallenvor 10 Jahren

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.

katabaticvor 10 Jahren

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

thegawvor 10 Jahren

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.

Walkmanvor 10 Jahren

A color picker for the base color would be handy

leepowersvor 10 Jahren

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/

[deleted]vor 10 Jahren

zhte415vor 10 Jahren

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

91bananasvor 10 Jahren

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

joekrillvor 10 Jahren

This is awesome. I was looking for something like this not too long ago and surprised I wasn't able to find anything to do this easily. Thanks!

BafSvor 10 Jahren

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

[deleted]vor 10 Jahren

ge96vor 10 Jahren

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.

sjrootvor 10 Jahren

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

thegawvor 10 Jahren

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?

joekrillvor 10 Jahren

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

[deleted]vor 10 Jahren

david927vor 10 Jahren

Well done!