The Picture Choice Block allows users to select one or more options from a set of predefined answers, just like the Multiple Choice Block. It’s useful when you want to provide structured responses without requiring users to type their own input.
What makes this block different is its visual layer: instead of plain text, you can add images, icons, or emojis to each option. This makes choices more engaging and intuitive - perfect for highlighting products, showing visual examples, or creating a more interactive experience.
In this article, you'll learn how to update the block's content, its settings and design.
Update the Content
After clicking on a building block, you’ll find the Content section on the right. This is where you add and edit the block’s main elements.
Label
Use the block label to ask your question or guide the user’s choice. Labels help users understand what’s being asked, and they’re important for accessibility, especially when using screen readers or other assistive technologies.
Options
Click + Add
to include more options. You can reorder options by dragging the six dots on the left side of each choice, or delete an option if needed.
Click on the icon to update it with a different icon or emoji, upload an image or choose one from your image library, or remove it altogether.
Click on the option label to edit the text directly. Need more detail? You can toggle Add description
to show a second line of text beneath each option. This might be helpful for giving extra context or explanations.
Change the Settings
After clicking on a building block, you’ll find the Settings section on the right. This is where you can customize the block’s options, appearance, and behavior to tailor it perfectly to your flow.
General
Control key settings for the block, including making values sensitive so they aren’t stored in our database and setting the block as required, making it mandatory for users to select an option before proceeding.
You can choose between single or multiple selections, and optionally set a default preselected option. For multiple selections, you can also define minimum and maximum limits on how many options a user can or must select.
Navigation
If your block is a single selection, you can choose what happens when a user selects an option under Navigation
:
Next page: Go to next page in order
Go to page: Choose a specific page
Conditional Logic: Define rules for the navigation to react to the users' input
Do nothing: Stay on the same page
Enable Navigate on option click
to trigger navigation instantly without a button.
💡 For better user experience and unified page structure, we recommend keeping a button in place even if the user navigations on option click.
🔎 Conditional Logic: Make your flow react dynamically to user answers by creating personalized paths. Show or skip questions based on relevance, or display additional tailored pages. Learn more here.
Appearance
Set the block’s visibility to show only on mobile, desktop, or hide it completely. You can also decide how many columns appear per row on mobile and desktop devices.
Additionally, you can select a background color for the block. Align your label and the options either to the left, center or right.
If you’re using your own uploaded images, you can set the image mode to fixed and manually adjust the image behavior and height separately for desktop and mobile views.
Spacing
Control the block’s layout by adjusting its width (S, M, L, or maximum) and setting the block's padding from the top, bottom, left, and right.
Labels & Variables
System Labels define how your data is stored and organized, while Variables let you reference and display that data dynamically throughout your flow. You can set a label for the whole block and individual labels for each option to keep your data structured and easy to use.
Tracking
If Tracking
is activated for that block, you can give each option an event name that will be sent to your connected tracking tools. You can find more information about tracking here.
❗️Meta allows a maximum of 50 characters for an event name.
Design your Block
After clicking on a building block, you’ll find the Design section on the right. You can quickly apply a preset style tailored to that block type. Also, customize colors, fonts, and spacing to match your flow.
When you apply a design to one block type, it automatically updates all blocks of that type across your flow. This keeps your design consistent, clean, and easy to maintain without styling each block manually.
🔎 Learn more in our full guide: Design Presets for Blocks
Also see Heyflow's other design options to individualize your flow and building blocks even more:
Best Practices & FAQ
⭐ Prequalify leads and improve lead quality
⭐ Prequalify leads and improve lead quality
Use the conditional logic to pre-qualify leads and redirect them to relevant pages.
❓What’s the recommended image size?
❓What’s the recommended image size?
Around 800×800px works well for most flows; keeps quality high without slowing load time.