Great vid! Another great way to create a color ramp is to use HSL and adjust Lightness. I usually adjust saturation as I go lighter to maintain vibrancy.
Thanks for making this! I'm confused by the "Action" role. Since hovering affects the state of a button, which could be Primary, Secondary, etc., wouldn't the second color be Surface-Primary-Hover?
That overcomplicates things. You should ideally have defined the primary in your alias collection, thus, not needed in your mapped collection. Take a look at our 'Creating an Advanced Figma Color Variable Library' video and it might help. Otherwise, join our slack and I can send you a draft of our tokens naming convention video coming out soon which will definitely help :)
Hey, you do you! :) just wanted to point out a perhaps more efficient way for color coding definitions. Especially, when it „hopefully“ will be possible to use calculations and formulas with variables. 🤞 Thank you for the valuable content you are providing on your channel. You have definitely have a new subscriber.
