code that could be improved if we had this:
You don’t have to have all colors in hsb just to do that
I haven’t seen anything like this in other languages
Can you please elaborate? I’m not quite sure what you mean.
i don’t think this should be available in a block, but rather an option when inputting a rgb/hsb value
like when you’re inputting rgb(50,81,19) you wont be able to guess the hsb value in your head, and vice versa
Yeah. You actually can by selecting a color and adding a math option but that only works with default colors and only changes to hsb
There are so many conversion programs on the internet, and I’m sure lots of apps have that functionality, too. Or you could just uniformly use HSB or RGB for all colors.
Actually what would be really cool is a project that converts HSB to RGB, and vice versa (I believe there already is one, actually)
yep, i saw one on hopscotch and it was really awesome
i guess what bobinny wishes is that the conversion is more convenient (like you dont need memorize the three values and exit the app and blablabla) but we shouldnt forget tht is a super small team so they won’t focus on having convenient stuff atm
That’s true. But how often does one work with both RGB and HSB in the same project?
Sometimes hsb is easy for me and sometimes rgb is easy too. But it gets harder when I want a lighter or darker color
You mean something like GitHub - bgrins/TinyColor: Fast, small color manipulation and conversion for JavaScript?
Even after reading the posts here, I can’t figure out what you mean by a color conversion block…
It makes no sense to me being in a color parameter, because it’s just going to be the same color as your input. Like, if you say set color to “convert HSB(0,100,100)” it would be set color to rgb(255, 0, 0), but that’s the same thing…?
Or do you mean an operator, like “add” and “subtract” – those return a value, but I’m still not sure how that would return a color (especially cause HS doesn’t have arrays).
Could you elaborate more on the use case? Like, what sort of project would you make with it?
Was it this one?
Not sure about Tri, but that’s the one I was thinking of~
I remember I wasn’t able to open it on my old iPad and got really frustrated. (Because I hadn’t updated HS yet at the time)
But I used it a lot before I had access to the internet.
i rather think this will make sense if it’s a tool, not a block
nop, it was by ketchup something
Here’s a trick that might help you!
If you have a HSB color, changing the B value (which stands for “Brightness”) is an easy way to make a color lighter/darker!
So, for example, to make the color HSB(200,40,50) lighter, increasing 50 (for example to 80) makes the color lighter.
If you’re looking for some websites to help you with colors, you can try looking at the one I linked in the aqua text in this post or look here. If you’re using online converters, keep in mind that many of them call it “HSV” instead of “HSB”. They are exactly the same! You might see HSL too, and that’s, however, different.
I’ve seen HSV where the V had a max value of 255. It was super annoying.
Yes, there are some people who write 0-100 as 0-1 instead too. That’s why it’s great to have converters!
I think it would be handy if you had an rgb colour, but wanted to make it brighter/darker, or if you wanted to change saturation etc…
I guess so, but again I’m not sure where the proposed editor change is – what would probably help is having a sketch or concept of a converter or something in the HS editor.
Once you are super familiar with RGB and hex, you’ll know how to do this without converting. That said though, it would be something really useful to have as a built-in tool in some way.
(I’m going off the assumption that you’d use it to make adjustments to a hex or rgb color you found online that doesn’t have its own way of adjusting the color?)
If someone wanted to convert RGB to HSV programmatically in Hopscotch, there’s a Wikipedia article with the formula for that here:
It’s kinda complicated to read but the math there adds up!
I found this JavaScript code snippet from this website that can convert from RGB to HSV, but I’m not sure if it works. I tried converting it to Hopscotch and I didn’t get it to work.
const RGBToHSB = (r, g, b) => {
r /= 255;
g /= 255;
b /= 255;
const v = Math.max(r, g, b),
n = v - Math.min(r, g, b);
const h =
n === 0 ? 0 : n && v === r ? (g - b) / n : v === g ? 2 + (b - r) / n : 4 + (r - g) / n;
return [60 * (h < 0 ? h + 6 : h), v && (n / v) * 100, v * 100];
};
RGBToHSB(252, 111, 48);
// [18.529411764705856, 80.95238095238095, 98.82352941176471]