All the built it components that have layout have a visibility option, “visible”, “invisible”.
But this leaves space where the element resides. There is no “display” option on any of the components so we can’t responsively do eg:
lg:hidden
Hmmm, this was brought up before 
Maybe @ben can shed some light on it.
For now you can use the Classes field:
I brought up hidden multiple times 
especially related to video, but that is not an elements issues just a general issue
https://forums.realmacsoftware.com/t/where-did-the-hidden-option-go/46064
plus there was a hidden
I have to resort to using the hidden class in the classes field. But I still think this is something that needs to be exposed in the settings somewhere.
1 Like
The display utility isn’t currently applied to any components because we’re still figuring out the best way to handle it so that it works consistently across all components.
It’s a bit trickier than it might seem—some components use display: grid, others use flex, and some default to block. So if you hide a component on medium screens using md:hidden, and then want to show it again on large screens, you’d need to know the original display value. You can’t just use lg:block if the component was originally a grid, for example.
We definitely plan to add a control for display, but I want to make sure it works reliably across all components—now and in the future—before we roll it out.
I do have an idea for how this could work; I just need to set aside some time to test it.
In the meantime, as @dan mentioned, you can use the Classes field to manually add display utilities if needed 
just spent a couple hours working on this one, and I’m happy to say I think I’ve nailed it 
This should be included in the next beta!
7 Likes
Made my day!
1 Like
Hi - I’d mentioned this in the YouTube comments on Dev Diary 73 - probably should add it here… RE: the Display “Hidden” and Visibility “Invisible” - I think I get the idea of what you’re doing, but does it confuse the issue for the actual, real CSS property names and values? If we ever got the ability to search (hint, hint) or filter via the Inspector, I don’t think I’m ever going to be looking for display:hidden;
From the screenshot - “Display” here feels like a section heading, like “Advanced” - but really it’s the display: property right? and perhaps should be handled like “Visibility” with the dropdown of available options. I’m new to Tailwind but this feels off somehow as it’s using the actual CSS property names.
That’s the actual CSS property name, and we’re aiming to keep the naming of controls and properties consistent with CSS and Tailwind wherever possible.
Yes, it is controlling the display CSS property—but in this case, it only allows you to set it to hidden.
The reason for this is that each component relies on a specific default display value to function properly. For example, we can’t allow the Grid component’s display to be changed to flex, as that would break how the Grid works.
We’re using Tailwind-style naming for almost all controls, but in a few edge cases like this one, we’ve chosen to go with with the underlying CSS naming to ensure clarity and predictability.
Hope that helps!
Yep - Thanks, Ben.. I’ll chalk this up to the peculiarity of TW’s “hidden” class actually meaning the CSS Display property value of “none”. 
and of course all the specificity issues that come down the CSSOM pipeline.