⭐ Available in the following bundle: Core Bundle
⭐ Bundle included in the following plans: Starter, Growth, Scale, Enterprise
⭐ Available on the following legacy plans: Basic, Pro, Agency, Business
👀 Not sure which plan you're on? Check your subscription here.
Block visibility in Heyflow lets you control when and where content appears in your flow. You can choose to show or hide blocks on specific devices or set up conditional rules to display them only when certain criteria are met.
This helps you create more dynamic and personalized user experiences and show content depending on users' answers and submitted data.
Device Visibility
In a block’s settings, you can control Default visibility. This lets you decide which devices a block should appear on.
You can choose between:
All (Mobile & Desktop) – The block is visible on all devices.
Only Mobile – The block is shown only on mobile devices.
Only Desktop – The block is shown only on desktop screens.
Hidden – The block is not visible on any device.
This is useful when you want to display different content depending on screen size. For example, mobile users often scroll more, so you might show a additional CTA button on mobile than on desktop.
Conditional Visibility
In a block’s settings, you can control Conditional visibility. This lets you decide based on which rules a block should appear.
You can control the visibility of any block, including containers, headlines, images and input fields. Set it up in the block's settings under Visibility or add a visibility rule in the Rules panel. Visibility updates instantly while visitors fill in the page.
💡 To edit hidden blocks, enable Display hidden blocks in the builder toolbar. Hidden blocks are then shown semi-transparent in the editor.
Add your conditions. Here, you have many possibilities to choose from:
Select an input block.
You can use inputs from all input blocks, e.g. Picture Choice, Multiple Choice, Input Field (incl. phone number, address and hidden fields), Slider, Scale, Icon Rating, Select, Checkbox and Date Picker.Tip: to use a URL or UTM parameter, pass it into a hidden input field and use that field in your rule. Make sure the parameter name matches the field's variable exactly.
💡 Set up a System Label to find your wanted input blocks faster.
Select a formula or create a new formula for your rule.
Select phone status, e.g. OTP status or network validation status.
Depending on the block type, you can choose from the following operators:
Equals: Checks if the input exactly matches the selected value
Not equals: Checks if the input does not match the selected value
Contains: Checks if the input contains the selected value
Does not contain: Checks if the input does not contain the selected value
Less than: Checks if the input is smaller than the selected value
Less than or equal to: Checks if the input is smaller than or equal to the selected value
Greater than: Checks if the input is greater than the selected value
Greater than or equal to: Checks if the input is greater than or equal to the selected value
Empty: Checks if there is no input
Not empty: Checks if there is an input
Then, select a value, for example, from a list of options or a value you define. If no options are provided, you can leave this field empty.
You can also create condition groups by clicking on the plus icon.
This allows you to adjust the conditions within a group.
Optionally, add more conditions. You can combine them with:
AND: All conditions must apply
OR: At least one condition must apply
Next, define what should happen if the conditions are met. You can choose between:
Hide: Hides the selected block on that page
Show: Shows the selected block on that page
Give your rule a name by clicking on the rule name or the three dots menu. Here, you can also duplicate or delete a rule.
Add more rules as needed. Use the back icon to return to your rule overview, where you can duplicate rules or add new ones at the top.
🔎 Learn more about Heyflow's logic features here.
💡 You can also set up navigation based on rules. Learn more about Advanced Conditional Navigation here.
🔎 The fallback 'In any other case navigate' only appears once a page has navigation rules. If an answer should reveal a block on the same page (visibility rule), turn off 'Navigate on option click' and let a Continue button handle navigation, otherwise the visitor leaves the page before seeing the block.
Example: Unit Switcher (e.g. cm / ft or kg / lbs)
A unit switcher lets respondents choose their preferred measurement unit and automatically shows the matching input field. Here's how to build one using Conditional Visibility.
Step 1: Add a unit selector
Insert a Multiple Choice Block into your flow.
Add your unit options as choices, e.g. "cm" and "ft".
Enable "Preselection" for one option so a unit is always selected by default.
Under "Appearance", set the layout to "Flex" or "Grid" to display the options side by side.
💡 With one unit preselected, the matching input field will be visible immediately when the respondent reaches this step, no extra click needed.
Step 2: Add your input blocks
Insert an Input Block for the first unit (e.g. cm).
Insert a second input block for the other unit (e.g. ft).
Under "Decorations" you can add a suffix text to make the difference clear.
Step 3: Set up Conditional Visibility
Select the first Input Block (e.g. cm).
Go to "Settings" → "Visibility" and click on "Set Rules" under "Conditional".
Add a rule: Hide this block (ft input) if [your Multiple Choice block] is "cm".
Repeat for the second input block; hide it only when the selected unit is "ft".
