Ability to toggle visibility of applied Style without removing it

I have a Color Style applied as a Fill on an object.

If I want to temporarily toggle that fill, my only option is to ‘Detach Style’ or remove the style entirely. Then I’d have to scroll through my list of styles and find which one was applied to add it again.

Instead, I want to keep the style intact but just temporarily be able to toggle it’s visibility.

When a regular colour is added as a Fill, on the other hand, there is an eye icon to toggle visibility of that fill. It’s helpful to be able to quickly preview how something looks with or without a background, for example.

I feel like this functionality discourages the use of Color Styles, which is counter productive.

Sure, it’s minor, but it’d speed up my workflow and encourage wider adoption of Styles.

Am I overlooking something, or trying to use styles in the wrong way?
Anyone else stumbled on this before?

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

Please search for existing topics before post! Press :mag: at the upper right to search.

I’d like to hide(with the eye icon in the Layer panel) styles of a layer(such as fill or stroke), but Figma only supporting hide layer styles which detached from style library.

I hope we cloud hide styles without detaching them.

Why I need this feature?
such as normal/hover/click with differ bg color, I’d like to hide or reopen the fill/stroke style when needed with out detaching them from created styles.

Once a color style is used for a fill color, you cannot toggle its visibility. The only option is to delete the fill entirely or detach from the color style.

Figma is all about linking and keeping styles up to date. The way this works actually prevents that from happening if one needs to turn off a background on a component. Anyone else? Saw one other post with no responses.

Suggestion: When an element has a fill that utilizes a color style component, one must detach the fill from that color style in order to hide it.

Proposal: Simply add the show/hide eyeball next to the color style in the fill section

Why: When build out components and refining designs, it’s very common to hide and show fills based on the context of components. Breaking the fill out of the predefined “color styles” then creates problems down the road if another designer begins working. The fill should always stay linked to the fill.

Attaching a quick GIF to illustrate.
color-style

1 Like

It’s intensely annoying having to detach a color style for visibility toggling.

Adding to this thread – this is a simple but important addition as there is currently no way to toggle visibility while maintaining color style connections, it’s one or the other.

This should be voted more. It’s a repetitive task having to unassign the style just to hide and having to reassign when you want to unhide the fill/stroke again.

Hi. I opened a topic because it also does not work for variables as well… I find it quite limiting too. If you could take a look at it and vote as well so it works for both styles and variables Ability to toggle visibility for styles and variables. I would appreciate that, thank you so much!

1 Like