{"schemaVersion":"2.0.0","defaultLanguage":"en","languages":["en"],"launchScreenId":"article_screen_help-block-header","screens":{"article_screen_help-block-header":{"id":"article_screen_help-block-header","name":"Header — all settings","tags":["article"],"screenType":"FlexibleLayout","position":{"x":0,"y":0},"content":{"canvas":{"background":{"kind":"solid","content":{"color":"#F7F8FA"}},"insets":{"top":0,"end":0,"bottom":0,"start":0},"webViewBackgroundColor":"#F7F8FA"},"animated":false,"offlineFirst":true,"flexibleLayout":{"scrollable":true,"insets":{"top":44,"end":28,"bottom":56,"start":28},"sections":[{"id":"intro","order":0,"kind":"Text","label":"Intro","layout":{"heightKind":"auto"},"textContent":{"title":{"translations":{"en":"Header — every setting"},"kind":"static","appearance":{"align":"start","fontSize":28,"fontWeight":800,"lineHeight":34,"color":"#101828"}},"subtitle":{"translations":{"en":"The top bar of the screen — the Back and Skip buttons and the progress indicator that shows how far along the visitor is. This guide documents every setting of the Header block, grouped by area. Each setting matches a real control in the screen editor."},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":400,"lineHeight":26,"color":"#475467"}}}},{"id":"section-context","order":1,"kind":"Media","label":"Header in the editor","layout":{"heightKind":"fixed","heightValue":360,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/context-section.png","name":"The screen editor with the Header section highlighted."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"section-context-cap","order":2,"kind":"Text","label":"Context caption","layout":{"heightKind":"auto"},"textContent":{"subtitle":{"translations":{"en":"Open the Header section in the screen editor to configure its settings."},"kind":"static","appearance":{"align":"start","fontSize":13,"fontWeight":500,"lineHeight":19,"color":"#667085"}}}},{"id":"article-first-applies-to","order":3,"kind":"Text","label":"Applies to","layout":{"heightKind":"auto"},"textContent":{"title":{"translations":{"en":"Applies to: Hero Content, Carousel, List Multi Pick, List Single Pick, Grid Multi Pick, Grid Single Pick, Progress Steps, Text Input, Wheel Picker, Hero List, and Web Embed screens."},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":25,"color":"#344054"}}}},{"id":"g-back-head","order":4,"kind":"Text","label":"Group: Back button","layout":{"heightKind":"auto","margin":{"top":40}},"textContent":{"title":{"translations":{"en":"Back button"},"kind":"static","appearance":{"align":"start","fontSize":19,"fontWeight":750,"lineHeight":26,"color":"#101828"}}}},{"id":"g-back-el","order":5,"kind":"Media","label":"Back button in the section","layout":{"heightKind":"fixed","heightValue":410,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/open-section-back.png","name":"Where the Back button sits inside the open Header section."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"g-back-el-cap","order":6,"kind":"Text","label":"Element caption","layout":{"heightKind":"auto"},"textContent":{"subtitle":{"translations":{"en":"Inside the Header section, this is the Back button."},"kind":"static","appearance":{"align":"start","fontSize":13,"fontWeight":500,"lineHeight":19,"color":"#667085"}}}},{"id":"set-headerbar-back","order":7,"kind":"Text","label":"Back button · Back Button Label","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Back Button Label"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Sets the text and styling of the Back control that returns visitors to the previous step. Defaults to a left arrow and supports other languages. Keep it small so it doesn't compete with your main action, and clear it to hide the button on the first screen, where there's nowhere to go back to."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-back-appearance-text-styles","order":8,"kind":"Text","label":"Back button · Back button text style","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Back button text style"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Overrides how the Back control's label looks — font, size, weight, color, alignment, line height, an optional highlight behind the text, and a strikethrough color. By default it inherits your project theme, which keeps every screen consistent. Touch this only when the Back label needs to match a specific header treatment, and keep it subtle so it never competes with your main action."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-back-appearance-text-styles-img","order":9,"kind":"Media","label":"Back button text style","layout":{"heightKind":"fixed","heightValue":304,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/back-styles-grid.png","name":"Where to find “Back button text style” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-back-appearance-text-styles-prop-text-background-color","order":10,"kind":"Text","label":"Back button text style · Text background color","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Text background color"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"An optional fill drawn behind the back button text (a highlight pill). Off unless you set it; leave empty for plain text on the screen background."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-back-appearance-text-styles-prop-font-family","order":11,"kind":"Text","label":"Back button text style · Font family","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Font family"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"The typeface of the back button."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-back-appearance-text-styles-prop-line-height","order":12,"kind":"Text","label":"Back button text style · Line height","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Line height"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Vertical spacing between lines of text — raise it to give multi-line text more breathing room."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-back-appearance-text-styles-prop-font-size","order":13,"kind":"Text","label":"Back button text style · Font size","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Font size"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Text size of the back button in pixels."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-back-appearance-text-styles-prop-font-weight","order":14,"kind":"Text","label":"Back button text style · Font weight","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Font weight"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"How bold the text is, from Thin through Bold to Black."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-back-appearance-text-styles-prop-text-color","order":15,"kind":"Text","label":"Back button text style · Text color","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Text color"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"The color of the back button text. Keep enough contrast with the background that it stays readable."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-back-appearance-text-styles-prop-text-align","order":16,"kind":"Text","label":"Back button text style · Text align","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Text align"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Horizontal alignment of the text: start (left), center, or end (right)."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-back-appearance-text-styles-prop-strikethrough-color","order":17,"kind":"Text","label":"Back button text style · Strikethrough color","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Strikethrough color"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Color of a line-through decoration when the text is struck out (for example, an old price)."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-back-appearance-text-styles-prop-background-opacity","order":18,"kind":"Text","label":"Back button text style · Background opacity","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Background opacity"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"How see-through the text background fill is, from 0% (invisible) to 100% (solid). Only matters when a background color is set."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-back-appearance-text-styles-prop-background-radius","order":19,"kind":"Text","label":"Back button text style · Background radius","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Background radius"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Corner rounding (px) of the text background fill; higher is softer."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"g-skip-head","order":20,"kind":"Text","label":"Group: Skip button","layout":{"heightKind":"auto","margin":{"top":40}},"textContent":{"title":{"translations":{"en":"Skip button"},"kind":"static","appearance":{"align":"start","fontSize":19,"fontWeight":750,"lineHeight":26,"color":"#101828"}}}},{"id":"g-skip-el","order":21,"kind":"Media","label":"Skip button in the section","layout":{"heightKind":"fixed","heightValue":410,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/open-section-skip.png","name":"Where the Skip button sits inside the open Header section."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"g-skip-el-cap","order":22,"kind":"Text","label":"Element caption","layout":{"heightKind":"auto"},"textContent":{"subtitle":{"translations":{"en":"Inside the Header section, this is the Skip button."},"kind":"static","appearance":{"align":"start","fontSize":13,"fontWeight":500,"lineHeight":19,"color":"#667085"}}}},{"id":"set-headerbar-skip","order":23,"kind":"Text","label":"Skip button · Skip Button Label","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Skip Button Label"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Sets the text and styling of the Skip control that lets visitors bypass this step. Defaults to 'SKIP' and supports other languages. Use it only where skipping is fine, and clear it to hide it on your paywall and key question screens, where an easy out lowers both sales and the answers you collect."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-skip-appearance-text-styles","order":24,"kind":"Text","label":"Skip button · Skip button text style","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Skip button text style"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Overrides how the Skip control's label looks — font, size, weight, color, alignment, line height, an optional highlight, and a strikethrough color. By default it inherits your theme. Keep Skip visually quiet (smaller, lower-contrast) so it doesn't pull attention away from continuing; restyle it only to fit a specific header look."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-skip-appearance-text-styles-img","order":25,"kind":"Media","label":"Skip button text style","layout":{"heightKind":"fixed","heightValue":289,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/skip-styles-grid.png","name":"Where to find “Skip button text style” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-skip-appearance-text-styles-prop-text-background-color","order":26,"kind":"Text","label":"Skip button text style · Text background color","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Text background color"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"An optional fill drawn behind the skip button text (a highlight pill). Off unless you set it; leave empty for plain text on the screen background."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-skip-appearance-text-styles-prop-font-family","order":27,"kind":"Text","label":"Skip button text style · Font family","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Font family"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"The typeface of the skip button."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-skip-appearance-text-styles-prop-line-height","order":28,"kind":"Text","label":"Skip button text style · Line height","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Line height"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Vertical spacing between lines of text — raise it to give multi-line text more breathing room."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-skip-appearance-text-styles-prop-font-size","order":29,"kind":"Text","label":"Skip button text style · Font size","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Font size"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Text size of the skip button in pixels."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-skip-appearance-text-styles-prop-font-weight","order":30,"kind":"Text","label":"Skip button text style · Font weight","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Font weight"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"How bold the text is, from Thin through Bold to Black."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-skip-appearance-text-styles-prop-text-color","order":31,"kind":"Text","label":"Skip button text style · Text color","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Text color"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"The color of the skip button text. Keep enough contrast with the background that it stays readable."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-skip-appearance-text-styles-prop-text-align","order":32,"kind":"Text","label":"Skip button text style · Text align","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Text align"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Horizontal alignment of the text: start (left), center, or end (right)."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-skip-appearance-text-styles-prop-strikethrough-color","order":33,"kind":"Text","label":"Skip button text style · Strikethrough color","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Strikethrough color"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Color of a line-through decoration when the text is struck out (for example, an old price)."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-skip-appearance-text-styles-prop-background-opacity","order":34,"kind":"Text","label":"Skip button text style · Background opacity","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Background opacity"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"How see-through the text background fill is, from 0% (invisible) to 100% (solid). Only matters when a background color is set."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-skip-appearance-text-styles-prop-background-radius","order":35,"kind":"Text","label":"Skip button text style · Background radius","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Background radius"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Corner rounding (px) of the text background fill; higher is softer."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"g-progress-head","order":36,"kind":"Text","label":"Group: Progress indicator","layout":{"heightKind":"auto","margin":{"top":40}},"textContent":{"title":{"translations":{"en":"Progress indicator"},"kind":"static","appearance":{"align":"start","fontSize":19,"fontWeight":750,"lineHeight":26,"color":"#101828"}}}},{"id":"g-progress-el","order":37,"kind":"Media","label":"Progress indicator in the section","layout":{"heightKind":"fixed","heightValue":410,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/open-section-progress-row.png","name":"Where the Progress indicator sits inside the open Header section."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"g-progress-el-cap","order":38,"kind":"Text","label":"Element caption","layout":{"heightKind":"auto"},"textContent":{"subtitle":{"translations":{"en":"Inside the Header section, this is the Progress indicator."},"kind":"static","appearance":{"align":"start","fontSize":13,"fontWeight":500,"lineHeight":19,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-kind","order":39,"kind":"Text","label":"Progress indicator · Progress Bar Style","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Progress Bar Style"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Chooses how progress through the funnel looks: a single continuous bar (Line) or segmented dots (Dashes), each with its own color controls below. A visible 'how far along' cue reassures visitors only a few steps remain, which lifts completion. Pick whichever fits your brand and keep it the same across screens."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progressindicator-kind-img","order":40,"kind":"Media","label":"Progress Bar Style","layout":{"heightKind":"fixed","heightValue":105,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-kind.png","name":"Where to find “Progress Bar Style” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progressindicator-activecolor","order":41,"kind":"Text","label":"Progress indicator · Completed Progress Color","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Completed Progress Color"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Colors the filled, completed part of the progress bar. Defaults to gold for the Line style and teal for Dashes. Use your brand accent and make sure it clearly stands out against the unfilled track color so visitors can see at a glance how far they've come."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progressindicator-activecolor-img","order":42,"kind":"Media","label":"Completed Progress Color","layout":{"heightKind":"fixed","heightValue":108,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-active-color.png","name":"Where to find “Completed Progress Color” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progressindicator-trackcolor","order":43,"kind":"Text","label":"Progress indicator · Remaining Progress Color","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Remaining Progress Color"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Colors the empty, not-yet-completed part of the progress bar. Defaults to white for the Line style and light gray for Dashes. Keep it muted next to the filled color so the completed portion clearly reads as progress rather than blending in."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progressindicator-trackcolor-img","order":44,"kind":"Media","label":"Remaining Progress Color","layout":{"heightKind":"fixed","heightValue":108,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-track-color.png","name":"Where to find “Remaining Progress Color” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progressindicator-title","order":45,"kind":"Text","label":"Progress indicator · Progress Bar Text","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Progress Bar Text"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Optional text shown with the progress bar, such as a 'Step 5 of 10' counter or a short line of reassurance. Supports other languages and styling; leave it empty for a clean bar-only look. Note this text is fixed per screen and won't count up on its own, so use it as a label unless you drive it from a variable."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progressindicator-title-img","order":46,"kind":"Media","label":"Progress Bar Text","layout":{"heightKind":"fixed","heightValue":112,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-title.png","name":"Where to find “Progress Bar Text” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progressindicator-icon","order":47,"kind":"Text","label":"Progress indicator · Optional Header Icon","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Optional Header Icon"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Adds an optional small icon, often a logo or step glyph, next to the progress bar, with controls for the image, its size, and its spacing. Most funnels leave this off. Use it only to reinforce branding in the header, and keep the icon small so it doesn't crowd the progress bar."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progressindicator-icon-img","order":48,"kind":"Media","label":"Optional Header Icon","layout":{"heightKind":"fixed","heightValue":112,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-icon.png","name":"Where to find “Optional Header Icon” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progressindicator-contentalignment","order":49,"kind":"Text","label":"Progress indicator · Progress Content Side","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Progress Content Side"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Sets where the icon and label sit across the header, on the left (Start), centered, or on the right (End). Mostly a cosmetic touch: centered usually looks balanced, while left or right lets you line the label up with your Back or Skip button. Adjust only if the default looks off."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progressindicator-contentalignment-img","order":50,"kind":"Media","label":"Progress Content Side","layout":{"heightKind":"fixed","heightValue":105,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-content-alignment.png","name":"Where to find “Progress Content Side” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progresslayout-fullwidth","order":51,"kind":"Text","label":"Progress indicator · Stretch Progress Edge-To-Edge","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Stretch Progress Edge-To-Edge"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"When on, the progress bar stretches all the way across the header; when off, it takes only the width its content needs. Use full width for a bold, obvious progress bar across the top of the screen. Turn it off when you want the bar compact and grouped with a label or icon."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progresslayout-fullwidth-img","order":52,"kind":"Media","label":"Stretch Progress Edge-To-Edge","layout":{"heightKind":"fixed","heightValue":104,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-full-width.png","name":"Where to find “Stretch Progress Edge-To-Edge” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progressindicator-respectbutton","order":53,"kind":"Text","label":"Progress indicator · Keep Progress Clear Of Buttons","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Keep Progress Clear Of Buttons"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"When on, which is the default, the progress bar shrinks so it never overlaps the Back or Skip buttons; when off, it can collide with them in a tight header. Leave it on. Turn it off only if you've removed those buttons and want the bar to use the full width."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progressindicator-respectbutton-img","order":54,"kind":"Media","label":"Keep Progress Clear Of Buttons","layout":{"heightKind":"fixed","heightValue":104,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-respect-buttons.png","name":"Where to find “Keep Progress Clear Of Buttons” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progresslayout-verticalalignment","order":55,"kind":"Text","label":"Progress indicator · Progress Height In Header","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Progress Height In Header"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Sets where the progress bar sits up and down within the header: at the top, centered, or at the bottom. Centered is the usual balanced choice; use bottom to sit it just above your content, or top to hug the status bar. Adjust only if the default placement looks off for your header height."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progresslayout-verticalalignment-img","order":56,"kind":"Media","label":"Progress Height In Header","layout":{"heightKind":"fixed","heightValue":109,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-vertical-align.png","name":"Where to find “Progress Height In Header” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progresslayout-insets","order":57,"kind":"Text","label":"Progress indicator · Spacing around the progress bar","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Spacing around the progress bar"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Sets the spacing on each side of the progress indicator alone, separate from the header's overall padding. Use it to fine-tune the gap around the bar, for example to nudge it down from the buttons, without moving the buttons themselves. Most funnels keep the default; adjust only when the bar sits too tight or too loose against the header."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progresslayout-insets-img","order":58,"kind":"Media","label":"Spacing around the progress bar","layout":{"heightKind":"fixed","heightValue":183,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-progress-insets.png","name":"Where to find “Spacing around the progress bar” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progressindicator-title-text-styles","order":59,"kind":"Text","label":"Progress indicator · Progress text style","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Progress text style"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Overrides how the progress label (for example 'Step 5 of 10') looks — font, size, weight, color, alignment, line height, an optional highlight, and a strikethrough color. By default it inherits your theme. Use it to make the reassurance text legible against your header background, and keep it small so it supports rather than overshadows the progress bar."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progressindicator-title-text-styles-img","order":60,"kind":"Media","label":"Progress text style","layout":{"heightKind":"fixed","heightValue":304,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/title-styles-grid.png","name":"Where to find “Progress text style” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progressindicator-title-text-styles-prop-text-background-color","order":61,"kind":"Text","label":"Progress text style · Text background color","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Text background color"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"An optional fill drawn behind the progress title text (a highlight pill). Off unless you set it; leave empty for plain text on the screen background."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-title-text-styles-prop-font-family","order":62,"kind":"Text","label":"Progress text style · Font family","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Font family"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"The typeface of the progress title."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-title-text-styles-prop-line-height","order":63,"kind":"Text","label":"Progress text style · Line height","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Line height"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Vertical spacing between lines of text — raise it to give multi-line text more breathing room."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-title-text-styles-prop-font-size","order":64,"kind":"Text","label":"Progress text style · Font size","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Font size"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Text size of the progress title in pixels."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-title-text-styles-prop-font-weight","order":65,"kind":"Text","label":"Progress text style · Font weight","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Font weight"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"How bold the text is, from Thin through Bold to Black."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-title-text-styles-prop-text-color","order":66,"kind":"Text","label":"Progress text style · Text color","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Text color"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"The color of the progress title text. Keep enough contrast with the background that it stays readable."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-title-text-styles-prop-text-align","order":67,"kind":"Text","label":"Progress text style · Text align","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Text align"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Horizontal alignment of the text: start (left), center, or end (right)."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-title-text-styles-prop-strikethrough-color","order":68,"kind":"Text","label":"Progress text style · Strikethrough color","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Strikethrough color"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Color of a line-through decoration when the text is struck out (for example, an old price)."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-title-text-styles-prop-background-opacity","order":69,"kind":"Text","label":"Progress text style · Background opacity","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Background opacity"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"How see-through the text background fill is, from 0% (invisible) to 100% (solid). Only matters when a background color is set."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-title-text-styles-prop-background-radius","order":70,"kind":"Text","label":"Progress text style · Background radius","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Background radius"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Corner rounding (px) of the text background fill; higher is softer."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-icon-styles","order":71,"kind":"Text","label":"Progress indicator · Header icon settings","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Header icon settings"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Controls the optional header icon shown next to the progress bar — its image (upload or URL), placement relative to the label, scale mode, width, height, corner rounding, and padding. Off by default. Turn it on only to reinforce branding in the header, and keep the icon small so it doesn't crowd the progress bar or the Back and Skip buttons."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-progressindicator-icon-styles-img","order":72,"kind":"Media","label":"Header icon settings","layout":{"heightKind":"fixed","heightValue":467,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/icon-styles-grid.png","name":"Where to find “Header icon settings” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-progressindicator-icon-styles-prop-enable-icon","order":73,"kind":"Text","label":"Header icon settings · Enable icon","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Enable icon"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Off by default. Turn on to show a small image (for example a logo) in the header next to the progress indicator; off for no image."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-icon-styles-prop-icon-image","order":74,"kind":"Text","label":"Header icon settings · Icon image","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Icon image"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Upload an image file or paste an image URL — the icon shown in the header. Leave empty to show no graphic."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-icon-styles-prop-placement","order":75,"kind":"Text","label":"Header icon settings · Placement","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Placement"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Where the icon sits relative to the progress title: Start (before it) or End (after it); the Fixed Start/End variants pin it to the header’s left/right edge; Top and Bottom stack it above or below."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-icon-styles-prop-scale-mode","order":76,"kind":"Text","label":"Header icon settings · Scale mode","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Scale mode"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"How the image fits its box: Scale to Fill (stretch), Aspect Fit (show the whole icon, may letterbox), Aspect Fill (cover the box, may crop), or Center (no resize)."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-icon-styles-prop-width","order":77,"kind":"Text","label":"Header icon settings · Width","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Width"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"The icon’s width in pixels (0–200)."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-icon-styles-prop-height","order":78,"kind":"Text","label":"Header icon settings · Height","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Height"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"The icon’s height in pixels (0–200)."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-icon-styles-prop-corner-radius","order":79,"kind":"Text","label":"Header icon settings · Corner radius","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Corner radius"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"Rounding of the icon’s corners in pixels; raise it to clip a square image into a rounded or circular badge."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"set-headerbar-progressindicator-icon-styles-prop-icon-padding","order":80,"kind":"Text","label":"Header icon settings · Icon padding","layout":{"heightKind":"auto","margin":{"top":10}},"textContent":{"title":{"translations":{"en":"• Icon padding"},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":700,"lineHeight":21,"color":"#344054"}},"subtitle":{"translations":{"en":"The space around the icon (top, right, bottom, left) — the gap between the icon and the surrounding header content."},"kind":"static","appearance":{"align":"start","fontSize":14,"fontWeight":400,"lineHeight":21,"color":"#667085"}}}},{"id":"g-appearance-head","order":81,"kind":"Text","label":"Group: Header bar appearance & spacing","layout":{"heightKind":"auto","margin":{"top":40}},"textContent":{"title":{"translations":{"en":"Header bar appearance & spacing"},"kind":"static","appearance":{"align":"start","fontSize":19,"fontWeight":750,"lineHeight":26,"color":"#101828"}}}},{"id":"g-appearance-el","order":82,"kind":"Media","label":"Header bar appearance & spacing in the section","layout":{"heightKind":"fixed","heightValue":410,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/open-section-appearance-gear.png","name":"Where the Header bar appearance & spacing sits inside the open Header section."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"g-appearance-el-cap","order":83,"kind":"Text","label":"Element caption","layout":{"heightKind":"auto"},"textContent":{"subtitle":{"translations":{"en":"Inside the Header section, this is the Header bar appearance & spacing."},"kind":"static","appearance":{"align":"start","fontSize":13,"fontWeight":500,"lineHeight":19,"color":"#667085"}}}},{"id":"set-headerbar-appearance-height","order":84,"kind":"Text","label":"Header bar appearance & spacing · Header Bar Height","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Header Bar Height"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Sets how tall the header bar is, from 20 to 200 pixels, with a default of 44, which is the space its buttons and progress bar share. Keep it near the default for a standard bar and raise it only if you add a tall icon or larger text. Going too small cramps the Back and Skip buttons and makes them hard to tap."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-appearance-height-img","order":85,"kind":"Media","label":"Header Bar Height","layout":{"heightKind":"fixed","heightValue":97,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/appearance-panel-height.png","name":"Where to find “Header Bar Height” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-appearance-backgroundcolor","order":86,"kind":"Text","label":"Header bar appearance & spacing · Header Bar Background","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Header Bar Background"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Fills the header bar with a color, or clear it to transparent so the screen background shows through for a floating header. Use a solid color to set the header apart from busy content. If you go transparent over a photo or video, check that the Back, Skip, and progress colors still stand out clearly."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-appearance-backgroundcolor-img","order":87,"kind":"Media","label":"Header Bar Background","layout":{"heightKind":"fixed","heightValue":108,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/appearance-panel-background.png","name":"Where to find “Header Bar Background” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-appearance-opacity","order":88,"kind":"Text","label":"Header bar appearance & spacing · Header See-Through Level","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Header See-Through Level"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Fades the whole header bar from fully solid to fully see-through, defaulting to solid. Lower it for a soft, partly transparent header that blends into a photo or video background. Keep it high enough that the Back, Skip, and progress controls stay easy to see."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-appearance-opacity-img","order":89,"kind":"Media","label":"Header See-Through Level","layout":{"heightKind":"fixed","heightValue":97,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/appearance-panel-opacity.png","name":"Where to find “Header See-Through Level” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-headerbar-insets","order":90,"kind":"Text","label":"Header bar appearance & spacing · Spacing inside the header","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Spacing inside the header"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Sets the inner spacing on each side (top, right, bottom, left) that pushes the Back button, Skip button, and progress bar away from the header edges. Raise the top value to keep these controls clear of the phone's status bar or notch, and adjust left/right so buttons aren't jammed against the screen edge. Start from the defaults and nudge only where something looks cramped, since a clean header keeps the first impression of your ad landing page tidy."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-headerbar-insets-img","order":91,"kind":"Media","label":"Spacing inside the header","layout":{"heightKind":"fixed","heightValue":183,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/appearance-panel-header-insets.png","name":"Where to find “Spacing inside the header” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}}]}}}},"metadata":{"kind":"article","alias":"help-block-header","articlePresentation":{"version":1,"profiles":{"standard":{"containerMaxWidth":640,"contentInsets":{"top":44,"end":28,"bottom":56,"start":28},"sectionPaddingScale":1,"textScale":1},"laptop":{"containerMaxWidth":620,"contentInsets":{"top":40,"end":28,"bottom":52,"start":28},"sectionPaddingScale":0.98,"textScale":0.98},"tablet":{"containerMaxWidth":560,"contentInsets":{"top":36,"end":24,"bottom":44,"start":24},"sectionPaddingScale":0.94,"textScale":0.95},"phone":{"containerMaxWidth":"100%","contentInsets":{"top":28,"end":16,"bottom":36,"start":16},"sectionPaddingScale":0.86,"textScale":0.9,"titleTextScale":0.86}}},"settingsMap":[{"fieldKey":"back","title":"Back Button Label","sectionType":"headerBar","group":"back","guideKey":"screenedit-header-back-button","editorTestId":"input-header-back-button","revealState":"open-section","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/open-section-back.png","articleSectionId":"set-headerbar-back","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"control","humanInstruction":"Find “Back Button Label”.","postconditionTestId":"input-header-back-button"}]},{"fieldKey":"back.appearance (text styles)","title":"Back button text style","sectionType":"headerBar","group":"back","guideKey":"screenedit-header-back-styles","editorTestId":"styles-group-header-back-button","revealState":"back-styles","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/back-styles-grid.png","articleSectionId":"set-headerbar-back-appearance-text-styles","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Back button style settings (the gear on the Back button row).","postconditionTestId":"styles-group-header-back-button"},{"to":"control","humanInstruction":"Find “Back button text style”.","postconditionTestId":"styles-group-header-back-button"}]},{"fieldKey":"skip","title":"Skip Button Label","sectionType":"headerBar","group":"skip","guideKey":"screenedit-header-skip-button","editorTestId":"input-header-skip-button","revealState":"open-section","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/open-section-skip.png","articleSectionId":"set-headerbar-skip","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"control","humanInstruction":"Find “Skip Button Label”.","postconditionTestId":"input-header-skip-button"}]},{"fieldKey":"skip.appearance (text styles)","title":"Skip button text style","sectionType":"headerBar","group":"skip","guideKey":"screenedit-header-skip-styles","editorTestId":"styles-group-header-skip-button","revealState":"skip-styles","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/skip-styles-grid.png","articleSectionId":"set-headerbar-skip-appearance-text-styles","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Skip button style settings (the gear on the Skip button row).","postconditionTestId":"styles-group-header-skip-button"},{"to":"control","humanInstruction":"Find “Skip button text style”.","postconditionTestId":"styles-group-header-skip-button"}]},{"fieldKey":"progressIndicator.kind","title":"Progress Bar Style","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-indicator-kind","editorTestId":"select-header-page-indicator-kind","revealState":"page-indicator-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-kind.png","articleSectionId":"set-headerbar-progressindicator-kind","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Page Indicator settings (the Tune toggle on the Page Indicator row).","postconditionTestId":"styles-toggle-header-page-indicator"},{"to":"control","humanInstruction":"Find “Progress Bar Style”.","postconditionTestId":"select-header-page-indicator-kind"}]},{"fieldKey":"progressIndicator.activeColor","title":"Completed Progress Color","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-active-color","editorTestId":"input-style-page-indicator-page-indicator-color","revealState":"page-indicator-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-active-color.png","articleSectionId":"set-headerbar-progressindicator-activecolor","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Page Indicator settings (the Tune toggle on the Page Indicator row).","postconditionTestId":"styles-toggle-header-page-indicator"},{"to":"control","humanInstruction":"Find “Completed Progress Color”.","postconditionTestId":"input-style-page-indicator-page-indicator-color"}]},{"fieldKey":"progressIndicator.trackColor","title":"Remaining Progress Color","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-track-color","editorTestId":"input-style-page-indicator-page-indicator-track","revealState":"page-indicator-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-track-color.png","articleSectionId":"set-headerbar-progressindicator-trackcolor","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Page Indicator settings (the Tune toggle on the Page Indicator row).","postconditionTestId":"styles-toggle-header-page-indicator"},{"to":"control","humanInstruction":"Find “Remaining Progress Color”.","postconditionTestId":"input-style-page-indicator-page-indicator-track"}]},{"fieldKey":"progressIndicator.title","title":"Progress Bar Text","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-title","editorTestId":"input-page-indicator-title","revealState":"page-indicator-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-title.png","articleSectionId":"set-headerbar-progressindicator-title","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Page Indicator settings (the Tune toggle on the Page Indicator row).","postconditionTestId":"styles-toggle-header-page-indicator"},{"to":"control","humanInstruction":"Find “Progress Bar Text”.","postconditionTestId":"input-page-indicator-title"}]},{"fieldKey":"progressIndicator.icon","title":"Optional Header Icon","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-icon","editorTestId":"button-style-section-icon","revealState":"page-indicator-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-icon.png","articleSectionId":"set-headerbar-progressindicator-icon","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Page Indicator settings (the Tune toggle on the Page Indicator row).","postconditionTestId":"styles-toggle-header-page-indicator"},{"to":"control","humanInstruction":"Find “Optional Header Icon”.","postconditionTestId":"button-style-section-icon"}]},{"fieldKey":"progressIndicator.contentAlignment","title":"Progress Content Side","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-content-alignment","editorTestId":"content.header.progressIndicator.contentAlignment-select","revealState":"page-indicator-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-content-alignment.png","articleSectionId":"set-headerbar-progressindicator-contentalignment","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Page Indicator settings (the Tune toggle on the Page Indicator row).","postconditionTestId":"styles-toggle-header-page-indicator"},{"to":"control","humanInstruction":"Find “Progress Content Side”.","postconditionTestId":"content.header.progressIndicator.contentAlignment-select"}]},{"fieldKey":"progressLayout.fullWidth","title":"Stretch Progress Edge-To-Edge","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-full-width","editorTestId":"toggle-header-progress-full-width","revealState":"page-indicator-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-full-width.png","articleSectionId":"set-headerbar-progresslayout-fullwidth","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Page Indicator settings (the Tune toggle on the Page Indicator row).","postconditionTestId":"styles-toggle-header-page-indicator"},{"to":"control","humanInstruction":"Find “Stretch Progress Edge-To-Edge”.","postconditionTestId":"toggle-header-progress-full-width"}]},{"fieldKey":"progressIndicator.respectButton","title":"Keep Progress Clear Of Buttons","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-respect-buttons","editorTestId":"toggle-header-progress-respect-buttons","revealState":"page-indicator-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-respect-buttons.png","articleSectionId":"set-headerbar-progressindicator-respectbutton","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Page Indicator settings (the Tune toggle on the Page Indicator row).","postconditionTestId":"styles-toggle-header-page-indicator"},{"to":"control","humanInstruction":"Find “Keep Progress Clear Of Buttons”.","postconditionTestId":"toggle-header-progress-respect-buttons"}]},{"fieldKey":"progressLayout.verticalAlignment","title":"Progress Height In Header","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-vertical-alignment","editorTestId":"select-header-progress-vertical-align","revealState":"page-indicator-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-vertical-align.png","articleSectionId":"set-headerbar-progresslayout-verticalalignment","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Page Indicator settings (the Tune toggle on the Page Indicator row).","postconditionTestId":"styles-toggle-header-page-indicator"},{"to":"control","humanInstruction":"Find “Progress Height In Header”.","postconditionTestId":"select-header-progress-vertical-align"}]},{"fieldKey":"progressLayout.insets","title":"Spacing around the progress bar","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-insets","editorTestId":"content.header.progressLayout.insets","revealState":"page-indicator-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/progress-panel-progress-insets.png","articleSectionId":"set-headerbar-progresslayout-insets","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the Page Indicator settings (the Tune toggle on the Page Indicator row).","postconditionTestId":"styles-toggle-header-page-indicator"},{"to":"control","humanInstruction":"Find “Spacing around the progress bar”.","postconditionTestId":"content.header.progressLayout.insets"}]},{"fieldKey":"progressIndicator.title (text styles)","title":"Progress text style","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-title-styles","editorTestId":"styles-group-page-indicator-title","revealState":"title-styles","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/title-styles-grid.png","articleSectionId":"set-headerbar-progressindicator-title-text-styles","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"In the Page Indicator settings, open the progress Title style settings.","postconditionTestId":"styles-group-page-indicator-title"},{"to":"control","humanInstruction":"Find “Progress text style”.","postconditionTestId":"styles-group-page-indicator-title"}]},{"fieldKey":"progressIndicator.icon (styles)","title":"Header icon settings","sectionType":"headerBar","group":"progress","guideKey":"screenedit-header-progress-icon-styles","editorTestId":"button-style-section-icon","revealState":"icon-styles","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/icon-styles-grid.png","articleSectionId":"set-headerbar-progressindicator-icon-styles","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"In the Page Indicator settings, enable and expand the Icon section.","postconditionTestId":"button-style-section-icon"},{"to":"control","humanInstruction":"Find “Header icon settings”.","postconditionTestId":"button-style-section-icon"}]},{"fieldKey":"appearance.height","title":"Header Bar Height","sectionType":"headerBar","group":"appearance","guideKey":"screenedit-header-appearance-height","editorTestId":"input-content.header.appearance.height","revealState":"appearance-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/appearance-panel-height.png","articleSectionId":"set-headerbar-appearance-height","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the header settings (the gear at the bottom of the Header section).","postconditionTestId":"input-content.header.appearance.height"},{"to":"control","humanInstruction":"Find “Header Bar Height”.","postconditionTestId":"input-content.header.appearance.height"}]},{"fieldKey":"appearance.backgroundColor","title":"Header Bar Background","sectionType":"headerBar","group":"appearance","guideKey":"screenedit-header-appearance-bg-color","editorTestId":"input-content.header.appearance.backgroundColor","revealState":"appearance-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/appearance-panel-background.png","articleSectionId":"set-headerbar-appearance-backgroundcolor","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the header settings (the gear at the bottom of the Header section).","postconditionTestId":"input-content.header.appearance.height"},{"to":"control","humanInstruction":"Find “Header Bar Background”.","postconditionTestId":"input-content.header.appearance.backgroundColor"}]},{"fieldKey":"appearance.opacity","title":"Header See-Through Level","sectionType":"headerBar","group":"appearance","guideKey":"screenedit-header-appearance-opacity","editorTestId":"input-content.header.appearance.opacity","revealState":"appearance-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/appearance-panel-opacity.png","articleSectionId":"set-headerbar-appearance-opacity","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the header settings (the gear at the bottom of the Header section).","postconditionTestId":"input-content.header.appearance.height"},{"to":"control","humanInstruction":"Find “Header See-Through Level”.","postconditionTestId":"input-content.header.appearance.opacity"}]},{"fieldKey":"insets","title":"Spacing inside the header","sectionType":"headerBar","group":"appearance","guideKey":"screenedit-header-insets","editorTestId":"content.header.insets","revealState":"appearance-panel","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-header-bar-section/0.3.0/configure-header-bar-section-2026-06-24T11-52-13-983Z-7978d53e/appearance-panel-header-insets.png","articleSectionId":"set-headerbar-insets","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Header section.","postconditionTestId":"section-header"},{"to":"panel","humanInstruction":"Open the header settings (the gear at the bottom of the Header section).","postconditionTestId":"input-content.header.appearance.height"},{"to":"control","humanInstruction":"Find “Spacing inside the header”.","postconditionTestId":"content.header.insets"}]}],"projectId":"arswew63RwQr6V4Ekb1Z","articleId":"help-block-header"},"webViewDefaultBackgroundColor":"#F7F8FA","projectAnalytics":{"consentManagement":{"enabled":true,"bannerText":"We use cookies to improve your experience and analyze site usage.","privacyPolicyUrl":"","defaultConsent":"denied"},"integrations":[{"platform":"segmently_internal","name":"Segmently Analytics","enabled":true,"config":{"mode":"http"},"createdAt":"2026-05-26T13:53:00.398Z","updatedAt":"2026-05-26T13:53:00.398Z","id":"int_mpmp3jsm_aij2kz"}]}}