Show HN: Do you know RGB? | Hacker News Reader

Show HN: Do you know RGB?

maxwellito.github.io

92 pointsmaxwellito59 comments

I like it, but when you make your guess the mystery color should change to the color it describes, not to green or red. You should use some other aspect to indicate success - shape, motion, font, anything other than color. You already have it shaking for an incorrect guess, so that’s good.

Yeah that green tripped me up.

That was confusing as hell. I had the mystery color at the top, just the hex characters, and it looked like it would be a light green. I tap on the light green and the mystery color box at the top turns dark green, yet it shows the same hex code as the light green one I tapped on. I can't tell if I got it right, wrong, or what. I tried another and it was equally confusing, so I left.

Definitely don't make the game end dafter one wrong guess. At least give me some lives or something, damn. Or, better yet, just let me play to the end, then give me my score.

I feel that way. Also there are many cases where I can eliminate two choices as obviously wrong but can’t tell the difference between two similar shades. I wouldn’t feel bad getting disqualified for a gross error but when it is two shades of bluish-green it doesn’t seem fair.

Another possibility is to give it more of a tournament feel where the early cases are easy and the last ones are hard so I get disqualified at 15/20 (webdev and photographer who does gfx programming for fun) but a real goldeneye could go further. 3/20 does not represent my skill.

that's not really what you want, what you want is for the starting of a new game to be automatic and not require extra clicks.

the way I'm suggesting (which is what the game is with extra clicks) is a game of "what's my longest streak of correct guesses" which actually makes your score look better than keeping your losses around.

That mechanic can be implemented without starting a new game at all. Increment a counter on correct guess, reset to 0 on incorrect, continue on through the game.

yes but you also need the length of your streak displayed

Not really. The proportion correct is more informative.

"streak" as i am using it (as it is used in baseball) means "all correct, but for how long", so the proportion correct is always 100%. a "three game winning streak" means you won 100% of the last three games, and 0% of the one game before that.

Odd, I only got one wrong, and it gave me a 10/20 score at the end. Is the scoring not 1-to-1?

edit: Oh, I see. Once you get one wrong the game ends immediately, but the score includes the full 20 rounds that you're supposed to get through.

Thank you for sharing!

However, you both ask about colors and use color for confirmation. This unfortunately is both confusing and makes a not nice overlap of one modality used for two things.

Quick solution: just use the correct color. Use other modality (e.g. shape V/X or text "Correct!" vs "Wrong!")

I worked with a guy once, and I was coding up the design of website from a PSD provided by the design team (yeah, that long ago). I was talking to him at my desk when I was doing the header and said something about needing to grab the hex for the red. This was a design he'd probably not seen before, and certainly never saw the PSD of. He called out the exact hex. That was one hell of a party trick.

I’m so confused. This is something people know? I mean, I can work it out from first principles knowing how color mixing works, but it sounds like people just … know them? I’ve been programming for almost 40 years and it would never have occurred to me to memorize this sort of thing.

I’d say this is firmly about knowing how colour mixing works, and not about memorising.

I got 14/20 on my first try just by knowing how the color mixing works. A few simple rules:

- Higher values mean brighter colors

- The closer the individual colors are to each other, the closer to "gray" it looks

- R + G = Yellow, R + B = Fuchsia, G + B = Teal

You also need to know the combinations, for when you get, eg, 0FF. Though I was once asked to find 0FF and the choices also had 1FF in them. Obviously it was pure luck.

The typical sets of primary/secondary colors are RGB and CMY. Which set is considered "primary" depends on if you're doing additive (light) or subtractive (ink/pigment) mixing.

In additive color mixing, Red (#F00), Green (#0F0) and Blue (#00F) are the primary colors, and Cyan, Magenta and Yellow are the secondary colors.

Cyan: Green+Blue (#0FF)

Magenta: Red+Blue (#F0F)

Yellow: Red+Green (#FF0)

I doubt anyone has many of them truly memorized. It's more like having the ability to quickly see each hex character and understand roughly what percentage that is, then quickly visualize the resulting color. My methodology playing this is to just convert each hex character to high, medium, or low, so you end up with something like "high red, medium blue, low green."

4096 colors is not too much to memorize.

In the English language, they call it "red"

In the programming language, we call it "f00"

4096 words for colors!

f00 is 3840

f00 is red, 1000h is the number of colors

Just know them no. Able to sanity check that an RGB value is the color it's supposed to be yes sometimes. It's not the most useful skill because you almost always get a swatch now, but sometimes being able to have some idea of how it'll look (should it be dark or light, grey or intense color) saves me 10 seconds here and there.

I like playing guess-RGB games every now and then because it improves the skill, but at the same time I find them really stressful haha.

>I mean, I can work it out from first principles knowing how color mixing works

did you try it? if you can work it out from first principles because you know how color mixing works, you should get a perfect score; that's the game. If you don't get a perfect score, you need to reinspect what you think you know about color mixing and even the first principles.

Yes, I got a perfect score. It just took me several minutes, whereas coworkers of mine got 15+ in just a few seconds.

More like being able to naturally parse the base 16 value without thinking about it, just like you can parse which of these numbers is bigger without thinking: 4 8

And then having a natural intuition for how the relative mixing of color values should look.

I’d say you could do pretty well if you took your time and thought analytically about it, but some people have just developed a strong intuition for it.

This would be much harder if there was a “none of the above” option.

First try: 16/20

https://imgur.com/a/c0yUOlw

Excellent game!

Good job! That’s really good! Oh damn I didn’t realised it was you!

Dear HN community, susam built the GuessMyRGB game which was a huge inspiration for this game. Please take the time to play it!!

https://susam.net/myrgb.html

That one had a thread last year, for anyone interested:

Guess my RGB - https://news.ycombinator.com/item?id=39882018 - March 2024 (144 comments)

Here is another one my friend shared with me that's interesting. The time constraint adds some excitement! https://color.method.ac/

I played a few rounds but it doesn't tell you what was correct, so there's no feedback to improve guesses.

Couldn't get above 3 for numerous tries, after 5 minutes or so managed to get to 18! I learned a lot playing this (and reflected on things I already "knew" but never reflected on why). Thanks!

I tried about 5 times and never got more than 3 right. It would be better if they started out a little easier and then increased the difficulty. Currently it seems random. At any time you might get three nearly identical green boxes and it’s game over.

Got to number 15 and the color was #C61. My choices were #D52, #161, #C61, and #C63. Sadly, I guessed #C63 and lost.

Maybe there should be some minimum distance between all of the choices.

I was actually hoping for a completely different type of game. As someone who is colorblind, my use case for RGB is to translate a description of a color (e.g. fuchsia) to a hex value for display on screen. Matching a hex value to a swatch is just setting myself up for failure.

Off topic, but this seems like a decent place to ask:

Has anyone else noticed the weird new grey color that automobiles have in the last year or so? Does anyone know how to describe that color? Can anyone explain how it is different from previous greys in RGB terms? Or even in paint color terms?

Nardo: https://youtu.be/KchX52bIZSg

Make sure to disable any dark mode extensions or the colors will not show up correctly.

Very fun game. Got 15/20. I think I'd do better at an HSL version.

It would be nice if this told you upfront how many questions there were - after sixteen with nothing changing I figured it was probably endless but apparently there are twenty?

Interesting that sometimes a washed out color will look darker than a pure color, even though there's more light overall.

Funny clicking that when my phone is in night modd, so black in greyscale.

haha this is such a cool and fun game.

Obligatory: what colour space?

Yes I know it's probably sRGB because that's ubiquitous on the web, but "RGB" technically is not a colour space.

Also interesting people talking about how they estimate the colours in their head - sRGB is not perceptually linear so if you're good at this game you've kinda reverse engineered the sRGB transform in your brain.

18/20, first try :)

You're good. I made 0/20 on my first try.

ask urself that question?

a 3 letter hex color is an HTML CSS convenience abbreviation… it has nothing to do with EGB..

i as u, how many bits are in an RGB color?

RGB is a color scale of three fractions. Those fractions can each be measured with any number of bits (1 bit, 4 bits, and 8 bits are choices that have seen some use).

Great, now we need a 12 bit BGR game for engineers on little endian systems ;)

> do you know rgb

> colours are in hex

am I missing something or being dumb?

It's a shortened form of hex colors from CSS, but it does correspond to RGB since the first character of the hex value is the R, the second character is the G, and the third is the B. So for instance, a hex value from this game of #F18 means the red is F (out of F), the green is 1 (out of F), and the blue is 8 (out of F).

This is hexadecimal notation for rgb. Each character represents 2 bytes, which encode a value from 0 to 255.

This is a bit more confusing because this is a shorthand notation: you’d actually need 2 hexadecimal characters for 2 bytes (eg #0077ff would be rbg(0, 127, 255)). In this shorthand notation, I think there’s an implied 0 (eg #07f is #0070f0).

So you can’t represent all rgb colour with only 3 characters, but for this use-case it’s fine.

In css you can use either of these 3 notations, for example

In CSS, #07f is the same as #0077ff. (i.e. double each symbols)

Thanks for the correction!

Every tool I've ever used referred to this as hex (including design tools but maybe I'm sheltered), whereas rgb refers to the 0-255 triples

If someone asked me for a colour in "RGB" they'd be rightly confused if gave them a hex format colour (obviously you can convert between them but that's not what they asked for)

I'm not sure I agree. One is RGB decimal, the other is RGB hex. It's not Lab, or HSV, or any other color space, it's RGB. Whether it's decimal or hex doesn't change that.

Hmmm I see what you mean, but it’s more of an abuse of language I think. Both are rgb. If I asked for an rgb id expect any format, it rarely matters (actually id probably expect an hex code _more_, i see it used more often, as its textual representation is well defined whereas the three numbers don’t have a universal textual representation)

The 3-digit shorthand for hexadecimal RGB colours dates back to CSS1, if not earlier.

From <https://www.w3.org/TR/CSS1/>:

> The format of an RGB value in hexadecimal notation is a '#' immediately followed by either three or six hexadecimal characters. The three-digit RGB notation (#rgb) is converted into six-digit form (#rrggbb) by replicating digits, not by adding zeros. For example, #fb0 expands to #ffbb00. This makes sure that white (#ffffff) can be specified with the short notation (#fff) and removes any dependencies on the color depth of the display.

I'm quite fond of the 3-digit hexadecmial RGB notation. It's a concise way to express the colours I use for web pages or Emacs font locking. In these cases, I rarely need the full 16-million-colour range offered by 6 digits. The 3 digits are usually more than enough, at least to me.

Reply on news.ycombinator.com