Skip to main content
Solved

Button states done right

  • October 10, 2021
  • 3 replies
  • 1381 views
Ori_Harel

Hey guys,

I’m trying to make a button component with hover state variation, the regular state fill is a color style. now on hover state I want to make it 10% brighter but Figma not allowing me to add more fill layers when you have color style.
Applying different color style is not an option as I want to keep the connection between the original color style.

Please help me solve this puzzle 🙂
Thanks in advance,

Or

Best answer by Gleb

You have several options, but I’m afraid none of them solves this issue well. You can vote for this proposal: Use styles in other styles. Options:

  1. Create a new style. I think this is the best solution for now, you just need to keep in mind to update both styles.
  2. Don’t use styles, use regular fills. Drawbacks are obvious and big.
  3. Create a background overlay rectangle. Not compatible with auto layout so not great for a button unless you are resizing it manually anyway.
View original
This topic has been closed for comments

3 replies

Gleb
  • Gleb
  • Power Member
  • 4707 replies
  • Answer
  • October 10, 2021

You have several options, but I’m afraid none of them solves this issue well. You can vote for this proposal: Use styles in other styles. Options:

  1. Create a new style. I think this is the best solution for now, you just need to keep in mind to update both styles.
  2. Don’t use styles, use regular fills. Drawbacks are obvious and big.
  3. Create a background overlay rectangle. Not compatible with auto layout so not great for a button unless you are resizing it manually anyway.
Ori_Harel
  • Ori_Harel
  • Author
  • 2 replies
  • October 11, 2021

Thank you Gleb, hope Figma will solve it soon…

A
  • Anonymous
  • 0 replies
  • November 10, 2021

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.

Terms & ConditionsCookie settings

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings