Skip to main content
Rona_Itzkin
Rona_Itzkin
Jun 12, 2022 8:19 AM UTC
Question

Icon component color in a button component

How do I make the Icon component, that is nested in the button component, color not adjustable? In the Button disabled mode the icon needs to be in a grey color, but the original color of the icon component is being implemented when I swap the icon variant.
Is there a way that the color that I’ve defined in the button component will be saved even when I’m swapping the icon variant? Or do I need to create a variant of all the icon options for the Button component?

Screen Shot 2022-06-12 at 11.15.13

    This topic has been closed for replies.

    5 replies

    Preslava
    Preslava
    Sep 5, 2022 6:27 AM UTC

    I have a similar problem - some of the icons change color some don’t. All of them are simple paths and are used as separate components with swap instance. I wrote to support but still don’t have an answer. Did you find anything?

      ByeWind
      ByeWind
      New Participant
      Nov 28, 2022 10:14 PM UTC

      same problem

        Yulia8
        Yulia8
        Dec 8, 2022 6:44 PM UTC

        Same problem

        srternasco
        srternasco
        Jul 17, 2024 9:06 PM UTC

        Same proiblem

        Celine_
        Figmate
        Celine_
        Community Support
        Jul 22, 2024 3:23 PM UTC

        Hi there! Sorry to hear this is happening. As the topics dated from 2022, if you are encountering a similar problem at the moment, it would be great that our support team investigate it. (I checked the latest support ticket about this issue and it seems to happen when creating complex variants).

        As these issues need further investigation, I’d suggest you to fill out this form so the team can have a look at it: here

        Please use your Figma email account, including a quick video recording so that, the team will have a bit more context, and please also include the URL of your file and share it with support-share@figma.com as an Editor so we can try to replicate it. Thank you!

        Terms & ConditionsAccessibility statement