5 ms·

Show HN: A little web app for playing around with colors

106 points by longsangstan 7y ago

Arkdy 7y ago
What does it mean when a public github project has no LICENSE file? Am I only legally allowed to view* the source code, but can't download and run it locally? Or can I run it locally, but not publish it publicly? * The source for the app doesn't have a License file as of dae0f0f: https://github.com/longsangstan/color-app https://github.com/longsangstan/color-app
- sb8244 7y ago
  https://help.github.com/articles/open-source-licensing/#what-happens-if-i-dont-choose-a-license https://help.github.com/articles/open-source-licensing/#what... > You're under no obligation to choose a license. However, without a license, the default copyright laws apply, meaning that you retain all rights to your source code and no one may reproduce, distribute, or create derivative works from your work. If you're creating an open source project, we strongly encourage you to include an open source license. The Open Source Guide provides additional guidance on choosing the correct license for your project. Looks like you probably can pull it down but not redistribute it or use it to create other programs.
  - deleted 7y ago
    [deleted]
- longsangstan 7y ago
  Didn't think about that haha. Will add a MIT license later. Thanks!
prashnts 7y ago
Looks pretty cool! I was delighted to see that the page loaded almost instantly, and the transitions, spring animations, all work super smoothly ! I’m usually frustrated with Material Design components because they « feel » slow for some reason, but this implementation works perfectly.
- degenerate 7y ago
  It's using Animate.css by Daniel Eden: https://daneden.github.io/animate.css/ https://daneden.github.io/animate.css/
  - longsangstan 7y ago
    Yes. I also used a react library called Pose: https://popmotion.io/pose/ https://popmotion.io/pose/
CharlesMerriam2 7y ago
Pretty
jedberg 7y ago
Look like it doesn't work on Safari (or at least Safari Version 13.0 (15608.1.37) on Catalina). The buttons are below the viewport and I can't scroll to them. It worked fine in Chrome.
- ac4tw 7y ago
  Confirmed on Safari 12.1.1--albeit different than you mention. Things work fine if I'm fullscreen on a 15", but if I reduce the window size, I see the color palette & buttons cover the image with no option to minimize or move them.
jmiskovic 7y ago
Very playful and focused. The only issue I have is with the preview image. The image shows islands of colors isolated by big white space. Most color combinations look good in this context. When two colored shapes touch each others, then things get tricky. Eyes can pick out subtle lightning clues, like darker colors moving toward purplish hues. Maybe add another image that shows overlapping colored shapes?
- longsangstan 7y ago
  It's really a good point. The graphic now can't really reflects how well do the colors go together. Apart from graphics, I am thinking maybe adding some sample UI/charts too... Thanks for your feedback!
kaiby 7y ago
Fun, but I couldn't figure out how to select a color (left-most bottom-menu icon) and have it transfer over to the play area (middle icon).
- longsangstan 7y ago
  It is indeed a problem. I am still thinking how to make these two pages work together.. maybe merge the first page into the color picker in second page. Thanks for your feedback!
acdw 7y ago
This gave me immediate nostalgia for the NES game "Color a Dinosaur" -- thanks for the little trip down memory lane!
pekim 7y ago
Unfortunately if the window height is much less than about 900px, or if I zoom in, the controls overlap the gradient-wrapper (and some of the image).
wafflesraccoon 7y ago
Another cool webapp is Coolors https://coolors.co/app https://coolors.co/app I use it a lot when I need to pick colors for a project.
- OrgNet 7y ago
  that app really spam the back button history (in Firefox, at least)
thecleaner 7y ago
This is hosted on a hk domain. Is this definitively not a coded message of some sort ?
- arman_ashrafian 7y ago
  stuck at the airport?
- longsangstan 7y ago
  Haha no. It just reflects that I am from HK. Anyway, please support HK:)
  - thecleaner 7y ago
    I do and I am sure several others support HK as well.
Daub 7y ago
While I acept the significance of complementary colors, the significance of triadic, split complementary, analogous and split complementary is open to debate. One issue is that almost all discussion of co called Colour harmony is around hue. Yet no hue exists without a lightness and saturation value, which have their own impact upon the aesthetic design. More broadly, Colour harmony is something of a bogus science, with its roots in the very beginnings of Colour science. Newton himself added an seventh Colour to his hue wheel just So that Colour would be anagous to musical scale. It didn’t stop there... Goethe, Itten and Kandinsky all followed suite. All claimed that Colour could be subject to high-order ‘good contrast’ known as harmony. As an art student, this bogus thinking was nothing but damaging, and took me years to shake off.
ac4tw 7y ago
Interesting idea @longsangstan--I played around with it for a while and liked how the colors would change on reload or palette click. I often muck around with colors using the Chrome debug tools, but it would be interesting to have something like this pop up as a dev plug-in with assignable sections/classes/ids so I could tweak things on the fly and o/p CSS--if that doesn't exist already.
- longsangstan 7y ago
  Actually at the beginning I was thinking whether to make a webapp or a chrome extension... A chrome extension is more suitable as a dev tool while a webapp is more easily sharable... Thanks for your suggestion!
  - ac4tw 7y ago
    Agreed--though much of the core code is shareable between both targets. When I first discovered the prototyping capabilities for colors/themes/samples in the Chrome dev tools, my mind was blown away b/c of how fast I could iterate. A plug-in might take that to the next level. It's hard to say without me surveying more of what's out there and in use--I get the sense that at a certain level, teams rely more on tools like Sketch, inVision studio, Framer etc. for this.
linkerzx 7y ago
Feels like I am 5 years old again!

106 points by longsangstan 7y ago

What does it mean when a public github project has no LICENSE file? Am I only legally allowed to view* the source code, but can't download and run it locally? Or can I run it locally, but not publish it publicly? * The source for the app doesn't have a License file as of dae0f0f: https://github.com/longsangstan/color-app https://github.com/longsangstan/color-app

sb8244 7y ago
https://help.github.com/articles/open-source-licensing/#what-happens-if-i-dont-choose-a-license https://help.github.com/articles/open-source-licensing/#what... > You're under no obligation to choose a license. However, without a license, the default copyright laws apply, meaning that you retain all rights to your source code and no one may reproduce, distribute, or create derivative works from your work. If you're creating an open source project, we strongly encourage you to include an open source license. The Open Source Guide provides additional guidance on choosing the correct license for your project. Looks like you probably can pull it down but not redistribute it or use it to create other programs.
- deleted 7y ago
  [deleted]
longsangstan 7y ago
Didn't think about that haha. Will add a MIT license later. Thanks!

prashnts 7y ago

Looks pretty cool! I was delighted to see that the page loaded almost instantly, and the transitions, spring animations, all work super smoothly ! I’m usually frustrated with Material Design components because they « feel » slow for some reason, but this implementation works perfectly.

degenerate 7y ago
It's using Animate.css by Daniel Eden: https://daneden.github.io/animate.css/ https://daneden.github.io/animate.css/
- longsangstan 7y ago
  Yes. I also used a react library called Pose: https://popmotion.io/pose/ https://popmotion.io/pose/

CharlesMerriam2 7y ago

Pretty

jedberg 7y ago

Look like it doesn't work on Safari (or at least Safari Version 13.0 (15608.1.37) on Catalina). The buttons are below the viewport and I can't scroll to them. It worked fine in Chrome.

ac4tw 7y ago
Confirmed on Safari 12.1.1--albeit different than you mention. Things work fine if I'm fullscreen on a 15", but if I reduce the window size, I see the color palette & buttons cover the image with no option to minimize or move them.

jmiskovic 7y ago

Very playful and focused. The only issue I have is with the preview image. The image shows islands of colors isolated by big white space. Most color combinations look good in this context. When two colored shapes touch each others, then things get tricky. Eyes can pick out subtle lightning clues, like darker colors moving toward purplish hues. Maybe add another image that shows overlapping colored shapes?

longsangstan 7y ago
It's really a good point. The graphic now can't really reflects how well do the colors go together. Apart from graphics, I am thinking maybe adding some sample UI/charts too... Thanks for your feedback!

kaiby 7y ago

Fun, but I couldn't figure out how to select a color (left-most bottom-menu icon) and have it transfer over to the play area (middle icon).

longsangstan 7y ago
It is indeed a problem. I am still thinking how to make these two pages work together.. maybe merge the first page into the color picker in second page. Thanks for your feedback!

acdw 7y ago

This gave me immediate nostalgia for the NES game "Color a Dinosaur" -- thanks for the little trip down memory lane!

pekim 7y ago

Unfortunately if the window height is much less than about 900px, or if I zoom in, the controls overlap the gradient-wrapper (and some of the image).

wafflesraccoon 7y ago

Another cool webapp is Coolors https://coolors.co/app https://coolors.co/app I use it a lot when I need to pick colors for a project.

OrgNet 7y ago
that app really spam the back button history (in Firefox, at least)

thecleaner 7y ago

This is hosted on a hk domain. Is this definitively not a coded message of some sort ?

arman_ashrafian 7y ago
stuck at the airport?
longsangstan 7y ago
Haha no. It just reflects that I am from HK. Anyway, please support HK:)
- thecleaner 7y ago
  I do and I am sure several others support HK as well.

Daub 7y ago

While I acept the significance of complementary colors, the significance of triadic, split complementary, analogous and split complementary is open to debate. One issue is that almost all discussion of co called Colour harmony is around hue. Yet no hue exists without a lightness and saturation value, which have their own impact upon the aesthetic design. More broadly, Colour harmony is something of a bogus science, with its roots in the very beginnings of Colour science. Newton himself added an seventh Colour to his hue wheel just So that Colour would be anagous to musical scale. It didn’t stop there... Goethe, Itten and Kandinsky all followed suite. All claimed that Colour could be subject to high-order ‘good contrast’ known as harmony. As an art student, this bogus thinking was nothing but damaging, and took me years to shake off.

ac4tw 7y ago

Interesting idea @longsangstan--I played around with it for a while and liked how the colors would change on reload or palette click. I often muck around with colors using the Chrome debug tools, but it would be interesting to have something like this pop up as a dev plug-in with assignable sections/classes/ids so I could tweak things on the fly and o/p CSS--if that doesn't exist already.

longsangstan 7y ago
Actually at the beginning I was thinking whether to make a webapp or a chrome extension... A chrome extension is more suitable as a dev tool while a webapp is more easily sharable... Thanks for your suggestion!
- ac4tw 7y ago
  Agreed--though much of the core code is shareable between both targets. When I first discovered the prototyping capabilities for colors/themes/samples in the Chrome dev tools, my mind was blown away b/c of how fast I could iterate. A plug-in might take that to the next level. It's hard to say without me surveying more of what's out there and in use--I get the sense that at a certain level, teams rely more on tools like Sketch, inVision studio, Framer etc. for this.

linkerzx 7y ago

Feels like I am 5 years old again!