Mariano Guerra 2021-03-02 11:27:46 Ivan Reese 2021-03-02 16:08:18 Strings are black, numbers are white...
I also saw a teal-like color when you set the values alternative index. What does that color represent? What other type-aware coloring should I look out for?
Mariano Guerra 2021-03-02 16:11:59 teal are "object properties", like size, keys, values, entries
Mariano Guerra 2021-03-02 16:13:16 variables (inputs, calculated fields) are round white with blue borders, they all have a box shadow since you can drag them
Mariano Guerra 2021-03-02 16:13:43 placeholders are the reverse of variables, they have the same colors but less opacity and are inset instead of having a box shadow
Mariano Guerra 2021-03-02 16:14:32 the prefix of a path is a mini card (same style as a card) with the icon for the card type, the title appears as a title on hover
Mariano Guerra 2021-03-02 16:17:09 forgot about columns, squareish, box-shadow, green are columns, they are equivalent to a range from 0:Infinity followed by a key, since they are so common they are their own thing
Mariano Guerra 2021-03-02 16:19:23 teal was always "temporary", it's to close to the green of columns and those properties should not catch so much attention since they aren't used so much as the other ones, I couldn't find a nice color for them yet, I may go with a grayer teal or something, running out of colors
Mariano Guerra 2021-03-02 16:37:42 gray makes more sense since they should not standout given that they are so secondary
Ivan Reese 2021-03-02 16:56:36
they all have a box shadow since you can drag them
Ah — are shadows the clue that things are draggable? So anything with a shadow can be dragged?
As for those gifs... which are totally not making me dizzy as I type this (lol)...
If you need a quick way to generate a palette, I'd look at the LAB/LCH color space. It's perceptually uniform across the hue range, so you can pick a lightness level and then divide the hue space into as many pieces as you need. Here's a tool you can use that will give you rgb colors you can use today (and warn you when you head outside the gamut): https://css.land/lch/
Ivan Reese 2021-03-02 16:57:53 (So if you need 10 different hues, just move the hue slider in increments of 36 — but feel free to deviate from that to taste)
Mariano Guerra 2021-03-02 17:02:35 I'm dizzyer than you, I had to disable the blue filter to see the colors the way they are, between that and switching themes back and forth I may be temporarily color blind 😛