Discuss Scratch
- Discussion Forums
- » Help with Scripts
- » Changing Color Effect to Match RGB values
- CodeWizard399
-
Scratcher
44 posts
Changing Color Effect to Match RGB values
Hiya there,
I'm working on a project that needs me to be able change the color of a sprite exactly based on RGB values. To do this, I have the sprite's base costume of the color red (0 degrees) and brightness and saturation at 100.
Then, in the main script, I change the desired RGB values to HSB/HSV (see https://www.rapidtables.com/convert/color/rgb-to-hsv.html for the formula). I convert the hue to 200/360 times the HSB value (because the color effect block goes from 0 to 200) and the saturation is converted from a percentage that's 0 to 1 to a number that's 0 to 100. Then, finally, comes brightness; I thought it scaled HSB's 0-1 value range for brightness to -100 to 100. However, that doesn't quite work, and I can only get the sprite to change color accurately for HSB/HSV values near 100%.
Here's the project I'm working on with this: https://scratch.mit.edu/projects/555981879/ The code should be fairly straightforward – there's a way to set RGB values in the “player” sprite and the “de hat” sprite constantly says whether or not it's touching the same RGB color as was set. The “set hue” function does the RGB to HSB and then Scratch CSB conversions.
Any ideas on how to get the sprite color transformation accurate? Thanks!
P.S. I'd suggest using https://scratch.mit.edu/projects/10941245/ if you want to experiment around a little bit. I've been on it for almost an hour now and can't seem to get this problem fixed. Also, https://scratch.mit.edu/projects/423622379/ is a great resource if you want to understand how desaturation in Scratch works
I'm working on a project that needs me to be able change the color of a sprite exactly based on RGB values. To do this, I have the sprite's base costume of the color red (0 degrees) and brightness and saturation at 100.
Then, in the main script, I change the desired RGB values to HSB/HSV (see https://www.rapidtables.com/convert/color/rgb-to-hsv.html for the formula). I convert the hue to 200/360 times the HSB value (because the color effect block goes from 0 to 200) and the saturation is converted from a percentage that's 0 to 1 to a number that's 0 to 100. Then, finally, comes brightness; I thought it scaled HSB's 0-1 value range for brightness to -100 to 100. However, that doesn't quite work, and I can only get the sprite to change color accurately for HSB/HSV values near 100%.
Here's the project I'm working on with this: https://scratch.mit.edu/projects/555981879/ The code should be fairly straightforward – there's a way to set RGB values in the “player” sprite and the “de hat” sprite constantly says whether or not it's touching the same RGB color as was set. The “set hue” function does the RGB to HSB and then Scratch CSB conversions.
Any ideas on how to get the sprite color transformation accurate? Thanks!
P.S. I'd suggest using https://scratch.mit.edu/projects/10941245/ if you want to experiment around a little bit. I've been on it for almost an hour now and can't seem to get this problem fixed. Also, https://scratch.mit.edu/projects/423622379/ is a great resource if you want to understand how desaturation in Scratch works
Last edited by CodeWizard399 (Jan. 1, 2022 23:21:51)
- LiveLaughLove-
-
Scratcher
1000+ posts
Changing Color Effect to Match RGB values
Hiya there,I would say using hex is probably better or to use a color code and then to the CSB conversions but scratch is very basic in color rgb values maybe try getting an exact value on another website and try to somehow put it in scratch
I'm working on a project that needs me to be able change the color of a sprite exactly based on RGB values. To do this, I have the sprite's base costume of the color red (0 degrees) and brightness and saturation at 100.
Then, in the main script, I change the desired RGB values to HSB/HSV (see https://www.rapidtables.com/convert/color/rgb-to-hsv.html for the formula). I convert the hue to 200/360 times the HSB value (because the color effect block goes from 0 to 200) and the saturation is converted from a percentage that's 0 to 1 to a number that's 0 to 100. Then, finally, comes brightness; I thought it scaled HSB's 0-1 value range for brightness to -100 to 100. However, that doesn't quite work, and I can only get the sprite to change color accurately for HSB/HSV values near 100%.
Here's the project I'm working on with this: https://scratch.mit.edu/projects/555981879/ The code should be fairly straightforward – there's a way to set RGB values in the “player” sprite and the “de hat” sprite constantly says whether or not it's touching the same RGB color as was set. The “set hue” function does the RGB to HSB and then Scratch CSB conversions.
Any ideas on how to get the sprite color transformation accurate? Thanks!
P.S. I'd suggest using https://scratch.mit.edu/projects/10941245/ if you want to experiment around a little bit. I've been on it for almost an hour now and can't seem to get this problem fixed. Also, https://scratch.mit.edu/projects/423622379/ is a great resource if you want to understand how desaturation in Scratch works
Last edited by LiveLaughLove- (Jan. 2, 2022 03:39:26)
- CodeWizard399
-
Scratcher
44 posts
Changing Color Effect to Match RGB values
Hi LiveLaughLove,
Thanks for your post! I already have a working RGB to HSB converter in Scratch. My question was about how to translate that to color effect, saturation, and brightness accurately for a sprite costume. I couldn't find converters from HSB to CSB online – probably because Scratch uses this different scheme as opposed to the conventional – and I might have H to C and S to S down in scratch anyway. I think brightness is what's posing the problem for be here.
Thanks for your post! I already have a working RGB to HSB converter in Scratch. My question was about how to translate that to color effect, saturation, and brightness accurately for a sprite costume. I couldn't find converters from HSB to CSB online – probably because Scratch uses this different scheme as opposed to the conventional – and I might have H to C and S to S down in scratch anyway. I think brightness is what's posing the problem for be here.
- LiveLaughLove-
-
Scratcher
1000+ posts
Changing Color Effect to Match RGB values
Hi LiveLaughLove,
Thanks for your post! I already have a working RGB to HSB converter in Scratch. My question was about how to translate that to color effect, saturation, and brightness accurately for a sprite costume. I couldn't find converters from HSB to CSB online – probably because Scratch uses this different scheme as opposed to the conventional – and I might have H to C and S to S down in scratch anyway. I think brightness is what's posing the problem for be here.
your welcome sorry I couldn't help!
hope you figure it out
- Scratch-Minion
-
Scratcher
1000+ posts
Changing Color Effect to Match RGB values
Hi.
I think you already convert Hue to Color and Brightness to Brightness in Scratch.
In Scratch, varying Color Effect from 0 to 200 is the same as varying hue from 0 to 100 in hsb.
In Scratch, varying Brightness Effect from -100 to 0 is the same as varying brightness from 0 to 100 in hsb.
I think Saturation may be the problem as it is not the same as Ghost Effect.
I created 11 Red costumes for a sprite with saturations 0, 10, 20, … 100 to roughly match sprite saturations to colours.
I then used the costume with the closest saturation and used the Color and Brightness calculated as above.
My example project: https://scratch.mit.edu/projects/528596850/ which draws a picture using red sprites with different saturations.
Another example: https://scratch.mit.edu/projects/528561456/
I think you already convert Hue to Color and Brightness to Brightness in Scratch.
In Scratch, varying Color Effect from 0 to 200 is the same as varying hue from 0 to 100 in hsb.
In Scratch, varying Brightness Effect from -100 to 0 is the same as varying brightness from 0 to 100 in hsb.
I think Saturation may be the problem as it is not the same as Ghost Effect.
I created 11 Red costumes for a sprite with saturations 0, 10, 20, … 100 to roughly match sprite saturations to colours.
I then used the costume with the closest saturation and used the Color and Brightness calculated as above.
My example project: https://scratch.mit.edu/projects/528596850/ which draws a picture using red sprites with different saturations.
Another example: https://scratch.mit.edu/projects/528561456/
- Dusteon
-
Scratcher
54 posts
Changing Color Effect to Match RGB values
I Think I know how to convert RGB to scratch color directly
- CodeWizard399
-
Scratcher
44 posts
Changing Color Effect to Match RGB values
Hi Scratch-Minion,
Thanks a lot for your post and projects! They look quite awesome.
I checked my own code against you project and it seems like I have hue to color down the same way. We also have the brightness formula the exact same.
So I think that you're right about the saturation. When I use the ghost effect to create saturation, one issue seems to be that the background's color also affects the touched color due to the lowered opacity, and I can't seem to find a workaround to this.
However, your brightness formula seems a bit off. I tried it with the hue formula on a sprite and found that, while it gets really close to the desired RGB at saturation 100%, it doesn't always match. Do you know how I could address this?
Even if I get a partial solution – something that only works for hue and brightness – it'd still be great. Thanks!
EDIT: Or, perhaps, the issue is the hue transformation to Scratch's colors – perhaps it's not exact. I've been experimenting with HSB values with Saturation 100% (that is, one of the RGB values is 0) and found that the slight inaccuracies can be mended if I just shift the HSB around a little, but I've got no idea what's actually causing the discrepancy
Thanks a lot for your post and projects! They look quite awesome.
I checked my own code against you project and it seems like I have hue to color down the same way. We also have the brightness formula the exact same.
So I think that you're right about the saturation. When I use the ghost effect to create saturation, one issue seems to be that the background's color also affects the touched color due to the lowered opacity, and I can't seem to find a workaround to this.
However, your brightness formula seems a bit off. I tried it with the hue formula on a sprite and found that, while it gets really close to the desired RGB at saturation 100%, it doesn't always match. Do you know how I could address this?
Even if I get a partial solution – something that only works for hue and brightness – it'd still be great. Thanks!
EDIT: Or, perhaps, the issue is the hue transformation to Scratch's colors – perhaps it's not exact. I've been experimenting with HSB values with Saturation 100% (that is, one of the RGB values is 0) and found that the slight inaccuracies can be mended if I just shift the HSB around a little, but I've got no idea what's actually causing the discrepancy
Last edited by CodeWizard399 (Jan. 2, 2022 12:54:24)
- CodeWizard399
-
Scratcher
44 posts
Changing Color Effect to Match RGB values
However, maybe there's a way to mimic HSB saturation anyway – it's just not going to be straightforward, I'd presume
- CodeWizard399
-
Scratcher
44 posts
Changing Color Effect to Match RGB values
le bump
Also, I've posted on why I'm looking for an accurate RGB to CSB method in the post here: https://scratch.mit.edu/discuss/topic/569320/?page=1#post-5912322
Also, I've posted on why I'm looking for an accurate RGB to CSB method in the post here: https://scratch.mit.edu/discuss/topic/569320/?page=1#post-5912322
Last edited by CodeWizard399 (Jan. 2, 2022 19:43:26)
- Scratch-Minion
-
Scratcher
1000+ posts
Changing Color Effect to Match RGB values
Hi Scratch-Minion,
Thanks a lot for your post and projects! They look quite awesome.
I checked my own code against you project and it seems like I have hue to color down the same way. We also have the brightness formula the exact same.
So I think that you're right about the saturation. When I use the ghost effect to create saturation, one issue seems to be that the background's color also affects the touched color due to the lowered opacity, and I can't seem to find a workaround to this.
However, your brightness formula seems a bit off. I tried it with the hue formula on a sprite and found that, while it gets really close to the desired RGB at saturation 100%, it doesn't always match. Do you know how I could address this?
Even if I get a partial solution – something that only works for hue and brightness – it'd still be great. Thanks!
EDIT: Or, perhaps, the issue is the hue transformation to Scratch's colors – perhaps it's not exact. I've been experimenting with HSB values with Saturation 100% (that is, one of the RGB values is 0) and found that the slight inaccuracies can be mended if I just shift the HSB around a little, but I've got no idea what's actually causing the discrepancy
Hi again.
I am unsure if you can match colours exactly.
For example, if you set Pen color, saturation and brightness in Scratch then draw with Pen,
the “touching color” block using the exact same color, saturation and brightness often does not find a match.
The reason for this is that color detection in Scratch uses RGB with limited accuracy as only 4 or 5 bits are used to detect the RGB components rather than the full 8 bits for a match.
Also there is not a 1-1 matching between the RGB and hsb colour models as there are 256*256*256 RGB colours but a different number of hsb colours and this is slightly different again in Scratch's implementation.
Overall, my answer is that I don't really know if what you want can be done.
Maybe someone else in the forums has an opinion.
- Discussion Forums
- » Help with Scripts
-
» Changing Color Effect to Match RGB values


