Future of Coding is an online community with a welcoming, cooperative, and revolutionary spirit. We are unified in the belief that the common practice of programming is tragically less humane than it could be.

Future of Coding

:date: Instadeq 2 Minute Week:

:fire: Firebase Source
:triangular_ruler: Resizable Tables
:repeat: Values Iterator

:movie_camera: <https://www.youtube.com/watch?v=A7EBGDkWBfI>

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?

teal are "object properties", like size, keys, values, entries

black is a key (a string), white is an index (a number)

variables (inputs, calculated fields) are round white with blue borders, they all have a box shadow since you can drag them

placeholders are the reverse of variables, they have the same colors but less opacity and are inset instead of having a box shadow

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

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

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

also it's the same color for active tabs which is not ideal

gray makes more sense since they should not standout given that they are so secondary

&gt; 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/>

(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)

yes, everything with a shadow should be draggable

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 :stuck_out_tongue: