How can I find the "Visible" setting in Webflow for my new project? It's an important setting that I frequently use.

TL;DR
  • Select the element, open the Style panel, and adjust the Display property (e.g., block, none) to control its visibility.  
  • Use Visibility settings to hide the element on specific devices or use the Interactions panel to toggle visibility dynamically based on user actions.

The "Visible" setting in Webflow typically refers to the Display or Visibility controls used to show or hide elements in your project. If you're looking to access or adjust visibility for any element in your new Webflow project, here's how to find it.

​

1. Select the Element on the Canvas

  • Click on the element you want to adjust (like a div, button, section, etc.).
  • The Settings and Style panels on the right-hand side will now reflect that selected element.

​

2. Open the Style Panel

  • Ensure you're in the Style panel (paintbrush icon on the right sidebar).
  • This panel controls all layout and visual styling including visibility.

​

3. Adjust the Display Property

  • Find the dropdown for the Display setting under the Layout section.
  • Common options include:
  • Block (element is visible and takes up full width)
  • Inline Block
  • Flex/Inline Flex
  • None (this makes the element invisible on the page)

​

4. Use Visibility Settings

  • Scroll down to the Layout → Visibility section.
  • You’ll see options like:
  • Hide on Desktop
  • Hide on Tablet
  • Hide on Mobile Landscape
  • Hide on Mobile Portrait
  • These let you conditionally hide elements based on device size.

​

5. Use Interactions to Control Visibility (Optional)

  • If you're using interactions to toggle visibility, go to the Interactions panel (lightning bolt icon).
  • There, you can add triggers like Click or Scroll into View to change an element’s visibility via the "Show/Hide" display action.

​

Summary

To control an element’s visibility in Webflow, select the element, go to the Style panel, and adjust the Display property or use the Visibility device toggles. For dynamic control, use the Interactions panel to show/hide elements based on user actions.

Webflow Resources
Webflow templates
Webflow inspiration
Rate this answer

Other Webflow Questions

Explore Logic tutorials
How can I stop a YouTube video from playing in the background in audio mode when I close a modal in Webflow?
Can you use Webflow's native icons like Close (X), Arrows (< >), and Hamburger/Menu icons instead of third-party tools like Font Awesome?
What can I do to scroll fixed content within a div in Webflow?
How can I implement a GDPR-compliant server-side cookie management solution on Webflow hosting, including a cookie consent banner or popup, and are there any third-party tools or workarounds that can assist with this?
How can Swiftype be integrated into a Webflow site?
What is the best way to position an image beside text in a container using Webflow?
Why is SEMRush reporting a 404 error on our Webflow website that includes our site URL followed by a colon ("/:")? How can we fix this issue?
What alternative approach can I take to resolve the issue with my multi-reference field in Webflow that is causing my Zap to occasionally not work?
What are the rules for participating in the Webflow Forums and how can you include your Public Link with your question?
Which shopping cart integrates well with Webflow for a custom lighting company that wants to allow visitors to purchase lighting fixtures "as shown" on the website? Thank you!
How can I troubleshoot the issue with a slider image not being hidden on some pages in Webflow, even when the visibility condition is set to "hidden"?
How can I auto start and loop a YouTube video in Webflow without the play button?
How can I trigger a typing text effect within the same wrapper in Webflow, first vertically and then horizontally?
What are the uses of Webflow and its integrations with third party tools?
How can I create a zoom-in effect on an image inside a container using Webflow? I've tried using columns, an image, and a div with the parent set to "overflow: hidden" but the animation still isn't working. Can someone please guide me on where I might be going wrong?
Can I capture a screenshot of a Webflow page on click and convert it to a downloadable PDF?
How can I alternate the layout of the image and heading for each collection item in a two-column format on Webflow?
How can I execute JavaScript code when clicking a specific button with a given ID in a Webflow project?
How can I disable the Webflow success or failure state for a sign-up form and display a custom thank you page using jQuery and the Webflow form submit state?
How can I create a vertical scrolling menu with Webflow, similar to the one on Apple's website, that switches to horizontal scrolling when the menu doesn't fit on one screen?
How can I change the language of the Google Maps embed from English to Arabic in Webflow?
How can I reduce the vertical space between lines within a bullet point in Webflow? Can I replace the bullet points with icons on the "Services" page?
How can the text color be changed for custom input fields on Webflow?
How can I add conditional visibility in Webflow to prevent a div from appearing on a published page if a CMS field is empty?
How can I stop a YouTube video from playing in the background in audio mode when I close a modal in Webflow?
How can I connect and use my JavaScript and CSS files for special functions and styles in Webflow?
How can I fix the "Ensure text remains visible during webfont load" warning in Webflow?
How can I implement a ThreeJS script as a background for my Webflow project using custom code?
How can I send data from a Webflow Form to ActiveCampaign without using Zapier? I have set the form to POST and input the form's action URL, similar to Mailchimp but it redirects me to the admin area of ActiveCampaign without sending the data. Has anyone had success with this method?
Can Webflow be used to create a "blob" elements effect in the header of a website using custom code or JavaScript?