Associate a components variant and an icon state?

I want to have a button with two states: default and selected. The default Button will use a outlined icon and the selected state will inherent the filled state of the icon.

Unfortunately, I am unable to change the state of the button and have the selected icon change states as well. Please help.

Hey @Scott_Jarrard, thanks for reaching out!

It’s hard to tell from your screenshots alone. Are you able to share a link to your file, so we here in the community can take a closer look at your components?

@dvaliao Thank you and sorry for the delay in responding.
Here is the Figma link:

I would like the icon within my button component to change from outlined to filled if it is in a hover or selected state.

Is this possible?

@Scott_Jarrard From what i see it seems you have connected the icons in you variant together which is causing you to have same value for all the variants, You need to break that link if you want to set a different state for each item. I couldn’t check it fully without edit access.

I just changed the settings so you can edit. Thanks. I am hoping to change the icon and name within a button.
When you hover over the new button with New icon, the new button will show the proper hover icon state. Thanks

@Scott_Jarrard Fixed it for you enjoy.

You should use component not variants. I added some pro tips for using Boolean I’m sure you can see the difference once you got in. follow the same for you designs.

You should also be super careful with layers naming when it comes to prototyping