6 ways to work smarter (not harder) with 🌈 colors in Figma (thread):

1. Tap "I" to bring up the eyedropper without losing your current flow.

Did you know you can press & hold your mouse button to *preview* different colors instead of clicking around trying to find what you need?

2. The eyedropper can be a crutch: it’s sometimes better to avoid it entirely to be more consistent.

Utilize the document colors panel, which shows all the colors used on every page in your current document.

Or make and use color variables.

3. You can use real color names like “green” or “purple” in the color input.

I like using “lightblue” and “pink” to block out colored sections or do some rapid designing.

BTW, these come from X11 color names: https://www.wikiwand.com/en/X11_color_names

Try out these weird names (see if you can predict what color they are):
- blanchedalmond
- burlywood
- cornsilk
- lemonchiffon
- sienna
- thistle

Oh, and test the difference between "darkgray" and "gray" 😏

Wikiwand - X11 color names

In computing, on the X Window System, X11 color names are represented in a simple text file, which maps certain strings to RGB color values. It was traditionally shipped with every X11 installation, hence the name, and is usually located in <X11root>/lib/X11/rgb.txt. The web colors list is descended from it but differs for certain color names. Color names are not standardized by Xlib or the X11 protocol. The list does not show continuity either in selected color values or in color names, and some color triplets have multiple names. Despite this, graphic designers and others got used to them, making it practically impossible to introduce a different list. In earlier releases of X11 , server implementors were encouraged to modify the RGB values in the reference color database to account for gamma correction. As of X.Org Release 7.4 rgb.txt is no longer included in the roll up release, The optional module xorg/app/rgb contains the stand-alone rgb.txt file.

Wikiwand
4. Utilize the selection panel to easily make bulk changes.

5. In the color panel or color input, use ↑↓ arrows to nudge it lighter or darker.

Adding ⇧ Shift makes bigger jumps.

6. If you use your mouse wheel with your cursor on the color picker, it will slide up and down the hues.

Hold ⌥ Option and you’ll slide up and down the opacity instead.

Pick one of these tips to try out the next time you're in Figma 👌

And be sure to share this post with a designer friend!