How to choose category colours

Anyone from netsblox reading this, the colour you should use is cherry 153 0 0.

Categories need colours so users can tell them apart from other categories. You can choose them from a colour selector or from RGB values, but either way it can be hard to make it not look like existing categories.
When making Hashtables into the new extensions format, I wanted to use a category instead of just using Other. I chose crimson there, but I might have to do it again, so I made a script to collect all of the crayons and sort them by distance to the existing categories.
You can search through the colours by hand, or you can use grep to find ones with a specific type. For example, grep reds colours.txt will give all the reds, and grep -v grays colours.txt will get all the colours that are not grays.
The first time I ran it, I got incorrect results because of not taking into account the light colours. I ran it once, and cherry was the best colour. I removed that one for use in netsblox, and these are my final results. Note that distance between the original colour and the light colour is not considered, which is why white isn't at the very bottom. I still would not recommend white, or really any grey. The next best is the exact opposite, cyan, although if everyone does than every category will be cyan. For example, crimson is 35th out of 90, looking somewhat similar to lists, which is fine because hashtables are similar to lists.

cyans:   aqua (cyan),              crayon 70, RGB   0 255 255
grays:   white,                    crayon 14, RGB 255 255 255
yellows: yellow,                   crayon 50, RGB 255 255   0
greens:  lime,                     crayon 60, RGB   0 255   0
grays:   black,                    crayon 0,  RGB   0   0   0
grays:   gray92,                   crayon 13, RGB 236 236 236
yellows: rubber duck,              crayon 59, RGB 251 225   8
pinks:   raspberry,                crayon 18, RGB 227  11  93
greens:  green,                    crayon 64, RGB   0 128   0
greens:  dark pastel green,        crayon 66, RGB   3 192  60
pinks:   deep pink,                crayon 15, RGB 255  20 147
pinks:   amaranth,                 crayon 19, RGB 229  43  80
pinks:   hot pink,                 crayon 16, RGB 255 105 180
yellows: gold,                     crayon 57, RGB 255 215   0
pinks:   bright pink,              crayon 17, RGB 255   0 127
grays:   gray7,                    crayon 1,  RGB  18  18  18
purples: magenta (fuchia),         crayon 95, RGB 255   0 255
reds:    red,                      crayon 20, RGB 255   0   0
greens:  dark green,               crayon 65, RGB   0 100   0
reds:    candy apple red,          crayon 28, RGB 255   8   0
yellows: dark goldenrod,           crayon 52, RGB 184 134  11
cyans:   deep sky blue,            crayon 77, RGB   0 191 255
cyans:   cerulean,                 crayon 72, RGB   0 123 167
purples: x11 purple,               crayon 94, RGB 160  32 240
yellows: egg yolk,                 crayon 58, RGB 254 227  62
browns:  brown,                    crayon 36, RGB 150  75   0
purples: grape,                    crayon 92, RGB 111  45 168
purples: purple,                   crayon 98, RGB 127   0 127
greens:  emerald,                  crayon 67, RGB  80 200 120
greens:  forest green,             crayon 63, RGB  34 139  34
greens:  mint,                     crayon 68, RGB  62 180 137
browns:  golden brown,             crayon 37, RGB 153 101  21
blues:   denim,                    crayon 84, RGB  21  96 189
blues:   midnight blue,            crayon 81, RGB  25  25 112
browns:  chocolate,                crayon 31, RGB 123  63   0
yellows: sandstorm,                crayon 55, RGB 236 213  64
reds:    crimson,                  crayon 26, RGB 201   0  22
blues:   cobalt,                   crayon 83, RGB   0  71 171
blues:   blue,                     crayon 80, RGB   0   0 255
browns:  cinnamon,                 crayon 38, RGB 184 115  51
purples: dark magenta,             crayon 99, RGB 139   0 139
purples: dark orchid,              crayon 96, RGB 153  50 204
browns:  saddle brown,             crayon 30, RGB 139  69  19
reds:    coquelicot,               crayon 29, RGB 255  56   0
blues:   cornflower,               crayon 88, RGB 100 149 237
grays:   gray14,                   crayon 2,  RGB  36  36  36
purples: indigo,                   crayon 93, RGB  75   0 130
purples: violet,                   crayon 90, RGB 128   0 255
grays:   gray85,                   crayon 12, RGB 218 218 218
greens:  apple green,              crayon 61, RGB 141 182   0
cyans:   azure,                    crayon 79, RGB   0 127 255
browns:  chestnut,                 crayon 34, RGB 149  69  53
oranges: pantone orange,           crayon 41, RGB 255  88   0
blues:   dark powder blue,         crayon 82, RGB   0  51 153
cyans:   dodger blue,              crayon 78, RGB  30 144 255
blues:   navy blue,                crayon 85, RGB   0   0 128
grays:   gray50,                   crayon 7,  RGB 127 127 127
blues:   steel blue,               crayon 86, RGB  70 130 180
cyans:   teal,                     crayon 75, RGB   0 128 128
oranges: ochre,                    crayon 47, RGB 204 119  34
browns:  sepia,                    crayon 33, RGB 112  66  20
yellows: mustard,                  crayon 56, RGB 255 219  88
yellows: saffron,                  crayon 54, RGB 244 196  48
reds:    sanguine,                 crayon 24, RGB 192   0   0
cyans:   light sky blue,           crayon 76, RGB 135 206 250
blues:   slate blue,               crayon 89, RGB 106  90 205
browns:  copper,                   crayon 39, RGB 210 105  30
cyans:   iceberg,                  crayon 73, RGB 113 166 210
cyans:   dark cyan,                crayon 71, RGB   0 139 139
oranges: spanish orange,           crayon 44, RGB 232  97   0
reds:    burgundy,                 crayon 21, RGB 144   0  32
browns:  kobicha,                  crayon 32, RGB 107  68  35
browns:  dark brown,               crayon 35, RGB 101  67  33
oranges: tangerine,                crayon 49, RGB 242 133   0
grays:   gray43,                   crayon 6,  RGB 109 109 109
oranges: orange,                   crayon 40, RGB 255 127   0
grays:   gray21,                   crayon 3,  RGB  54  54  54
oranges: carrot,                   crayon 48, RGB 237 145  33
reds:    maroon,                   crayon 25, RGB 128   0   0
grays:   gray64,                   crayon 9,  RGB 163 163 163
oranges: burnt orange,             crayon 45, RGB 204  85   0
oranges: sinopia,                  crayon 46, RGB 203  65  11
grays:   gray71,                   crayon 10, RGB 181 181 181
grays:   gray78,                   crayon 11, RGB 200 200 200
oranges: pumpkin,                  crayon 42, RGB 255 117  24
yellows: goldenrod,                crayon 53, RGB 218 165  32
grays:   gray36,                   crayon 5,  RGB  92  92  92
reds:    dark candy apple red,     crayon 23, RGB 164   0   0
grays:   gray28,                   crayon 4,  RGB  72  72  72
grays:   gray57,                   crayon 8,  RGB 145 145 145

Uh...?

I'm kinda dumb.

When you want to make a category, you can choose a colour from this list, and the farther up ones are more different from primitive categories. You should probably use the top list, but I included another one which you can use if netsblox gets a different colour. I would also not recommend grays beyond white or black, since they can look similar.

Bear in mind also that when you create a category you are actually choosing two colors, because of zebra coloring, so you want to be sure they're both different from existing categories.
untitled script pic

How are the two colours determined? I just used the crayons named after categories, which only has the default colours, and not the zebra variants.

What you specify is the dark version. The lighter version is


i.e., mix 60/40 with white.

Ok, I fixed that now. Cherry is now the best colour, instead of navy blue, and the next best is cyan instead of dark green. I didn't include the difference in colours between the light and dark versions of the same category, but I did for the light of one to the light of another.
Maybe snap should make the text always dark if the colour is bright enough, to make the text easier to read.
untitled script pic

Our official colors are all chosen to be darkish pre-zebra-coloring, so using dark lettering iff using the lighter variant makes sense. In your (contrived) example, never mind the lettering, I had to zoom in a lot before I could see that your lighter version is actually a bit lighter!

Maybe Snap! shouldn't let you choose tints, but only shades, as category colors.

Can anyone explain how to set a category color by RGB values? (I merely found the color selector)

Right click the color selector in the create category dialog

Thanks, I knew that :wink:.

Using the color selector doesn't yield a precise color such as will be had when one literally specifies RGB values. In post 1 @spaceelephant suggested the latter to be an option, and since no one (including @bh ) contradicted I assumed it must be true, if only I could find "the right button to push"

I export and edit the xml and re-import it when I want precise colours

As an aside, If I want my colour to look Snap!ish, I use this site

I enter one of the main Snap! category RGB colours and then adjust hue and then copy the resulting RGB values back into the .xml

run the script"
go to 0 0
clear
set pen rgba to xxx
fill"
and pick the color on the stage

That's what I call out-of- the-box thinking :slight_smile:

Never occurred to me to try outside the colour picker :slight_smile:

that would be a small box tho :slight_smile:

Is this what you want?
untitled script pic

So color selection by RGB-value is not supported by Snap! itself (I’m not ready for taking refuge to XML hacking yet).
A related question: is there a (official) way to rearrange custom blocks within a category palette area?

Will that help to fix the color of a category? Now that we’re discussing all this: is there a (official) method for changing a category color?

I think d4s_over_dt3 setting the pen to an RGB value (just using Brian's block and then picking the colour from the turtle costume) is not a bad workaround

No

No

Oh. Categories. I'm a little slow to catch on lately.

So, yes, set the pen color by RGB list, then open the "make a category" dialog, click on the color-picker box, then click on the turtle. Color picker dialogs let you click outside the actual picker box, anywhere in the Snap! page. (Alas, not outside, because then Snap! doesn't get the mouse click event.)

Rearranging blocks within the palette is something users (including me) have been asking for since forever. I imagine we'll get to that someday. ;~)

P.S. One reason Jens hasn't done this yet is that I complicate things by asking for 2D control so I can do this:
foo