Wrapping Up

[00:00:00]
>> Question about colors, especially color variables.
>> Yeah.
>> I'm always messing with hex, normally hex values, but then every once in a while I wanna use the same color scheme. I wanna use an RGBA and ltrying to match those up and not just paste in some RGBA that is hard coded instead of matching the color scheme in.

[00:00:21]
>> Yeah, so the Export Tools you can choose various different formats. I really like HSL because it's very easy to keep consistent, like shade and lightness, of course, different hues, right? And so for that, a lot of times I'll just use the tools in the Export, right? In Figma itself, it shockingly doesn't care, right, insofar that we don't need version history.

[00:00:46]
Show me the button. If I go into this style, for instance, right? No, where is my little, I think I gotta go into the variables now. Styles, you can hit the little things variables, you have to go in here. Back to my base colors. That was a lot of work.

[00:01:09]
The cool part in Figma is that they're all effectively the same thing, right? So it's currently set to HSL because that's what I was using last. But you can see that in the variable table there, hex, right? And so, in Figma, you can very cleanly swing, and you actually get the CSS value.

[00:01:25]
But I a lot of times like this because I can do different hues. Like somebody mentioned in the chat earlier, Figma doesn't care but then it becomes the, how do you export it, right? And the nice part is if those colors are generated, you all of a sudden do tend to care less, right?

[00:01:41]
And so one of the things that you can do with CSS variables is you can write your CSS variable in such a way that it's a little bit different than the RGBA or RGB syntax, it's spaces between them. But you can write a CSS variable which is like those first three values, and then allowing you to pass in different opacities for the RGBA, right?

[00:02:07]
So some of that you can do with code, which is like, hey, and you can build the variables, like we've got this red, and then we have a fourth value that we can pass in. And then I no longer think about the RGB part, it's just the A in that case.

[00:02:21]
Thank you all so much. Whoa, thank you so much!
>> [APPLAUSE]