Simple Label

Simple Label Control in SpreadsheetWeb Designer

The Simple Label control displays formatted text, structured content, and dynamic workbook values in your application. Use it for instructions, summaries, images, tables, disclosures, and other content without writing custom HTML.

This control is ideal for:

• Section titles and headers
• User instructions and descriptions
• Grouping related inputs
• Displaying calculated outputs or summaries
• Enhancing the overall UI/UX of your application

Open the content editor

1. Open Layout & Controls in SpreadsheetWeb Designer.
2. Select an existing Simple Label on the canvas.
3. Use its Setup tab to edit the content.
4. Type / in the editor to browse blocks. Select text to access inline formatting, or open an existing block's configuration to change its options.

Content editing saves automatically after editing has been idle for about three seconds. Activity in icon and workbook-value pickers is included in that idle period; image uploads save immediately. Finish editing and allow pending changes to save before switching tasks. Saving draft content does not publish the application.

Choose a content block

Choose the block that best matches the information you want to present. Alongside text, lists, tables, alerts, icons, charts, and carousels, the available layouts include:

• Hero: Builds a prominent introduction or callout with a title, supporting text, and visual emphasis.
• Metric: Presents a key value or KPI with a concise label and supporting context.
• Diagram: Organizes related information into a visual explanatory layout.

The block picker previews the available layouts. After choosing a block, use its editor to configure content, appearance, and any named-range values.

The October 2026 release adds more ways to organize existing content: collapsible disclosures, styled tables, tables of contents with optional completion tracking, image framing, and inline emphasis treatments. These complement the existing content blocks rather than replacing workbook bindings.

Dynamic Content Support with Named Ranges

The Simple Label control supports dynamic content by referencing named ranges from your Excel file.

To insert a dynamic value, use double curly brackets:

{{NamedRange}}

When typing {{, the Designer will automatically display a list of available named ranges for selection.

This allows you to:

• Display calculated results inline with text
• Show user-specific or context-specific values
• Combine static text with dynamic outputs

Example: Total Premium: {{TotalPremium}}

At runtime, the control will render the value of the TotalPremium named range.

Text and Formatting Options

These options define how the text is styled and presented:

• Body: Standard paragraph text used for general descriptions or instructions.
• Title: The highest-level heading, typically used for the main title of a page or section.
• Subtitle: A secondary heading that supports the main title.
• Heading: A prominent section heading used to organize major parts of the interface.
• Subheading: A smaller heading used within sections for additional structure.
• Section Header: Used to clearly separate logical sections within a page.
• Small Header: A subtle header for minor sections or grouped elements.
• Quote: Displays text in a stylized quote format, often used for emphasis or notes.
• Divider: A horizontal separator used to visually break content into sections.

Inline emphasis

Select the words you want to emphasize and open the inline emphasis options. Compare the preview, choose a Treatment and Color style, then select Apply emphasis. Use Cancel to leave the selection unchanged, or Remove emphasis to remove the treatment.

The 12 treatments are Accent, Highlighter, Soft highlight, Underline, Double underline, Wavy underline, Sketched underline, Circled, Outlined, Gradient, Glow, and Softened.

Color styles use the application's semantic colors: Primary, Secondary, Info, Success, Warning, and Danger. For example, a highlighter can bring a key message forward, a wavy underline can add an accent to a phrase, and gradient text can distinguish a headline.

These examples come from the 26.10 release demonstration. Keep emphasized text readable and do not use color alone to communicate an instruction or status. Use the available text-style and width choices to fit the content into the page, and inspect the result at smaller screen sizes.

Creating List and Structured Content

These options allow you to present structured lists:

• Bullet List: Displays an unordered list of items.
• Ordered List: Displays a numbered list, useful for step-by-step instructions.
• Task List: Displays a checklist-style list, typically used for tasks or requirements.

Collapsible disclosures

Use a disclosure to keep supporting details available without showing all of them at once. Find the disclosure block from the / block list, configure its content, and review both the collapsed summary and the expanded details in Preview.

Good uses include explanations of a calculation, optional examples, and background information. Keep essential instructions visible so users do not have to discover a collapsed section before they can complete the task.

Tables of contents and completion tracking

Add a Table of Contents block when a longer content area needs a navigable outline. Configure the block's entries and review the links in the actual application. Optional completion tracking can help users work through the content; enable it when that interaction suits the material.

Test the links and tracking behavior in Preview. Do not treat a visual completion indicator as a substitute for a saved business record, required validation, or application permissions.

Styled tables

Use a table block for structured content and open its configuration to choose a coordinated presentation. Review headings, cell content, and readability with the application's theme. A styled content table is different from an editable Input Grid or a workbook-bound Output Grid; choose the appropriate control when users need those behaviors.

Advanced Content Features

The Simple Label control also supports richer content elements:

• Image: Displays an image within the application. Useful for branding, diagrams, or visual guidance.
• Code: Formats text as a code block, ideal for technical instructions or examples.
• Table: Displays structured tabular data for better readability of grouped information.
• Alert: Highlights important messages such as warnings, tips, or notifications.
• Carousel: Displays multiple pieces of content (such as images or text) in a rotating or scrollable format.
• Charts: Display data from a named range as an interactive chart.

Images, crop, and framing

Open an image block's configuration to keep the image source, description, framing, and preview together.

1. Provide the Image URL or use Upload image.
2. Enter useful Alt text describing the image's purpose for people using a screen reader.
3. Choose the Frame that suits the content. The release example below uses Custom · 3.2:1; your framing choice may differ.
4. Adjust Horizontal focus, Vertical focus, and Zoom while checking the visible crop preview.
5. Review the image with its surrounding text and any caption, including the result on a smaller screen.

This image-framing example is from the 26.10 release demonstration. Frame the subject without cropping out important context. Cropping an image does not replace its alt text or the surrounding explanation.

Charts

The Charts option allows you to transform worksheet data into interactive visualizations directly within your application. Charts are configured using a named range as the data source and can display one or more data series.

For more advanced charting requirements, SpreadsheetWeb also offers the dedicated Charts control, which supports a wider range of features and customization options. If your application requires complex chart layouts, advanced formatting, Excel chart compatibility, dynamic series behavior, or highly customized visualizations, the dedicated Charts control is generally the recommended approach.

Following is a list of supported chart types:

• Column
• Bar
• Line
• Area
• Pie
• Donut
• Radar
• Bubble
• Scatter
• Combo

When the Charts option is enabled, additional configuration settings become available to control both the data source and the visual appearance of the chart.

The Table setting determines the named range that will serve as the chart’s data source. The selected table should contain at least one category column and one or more numeric value columns. The Category Field specifies which column will be used for category labels, such as years, months, products, departments, or regions. The Value Fields setting allows you to select one or more numeric columns to display as chart series. Selecting multiple value fields makes it possible to compare multiple datasets within the same chart.

For charts that contain multiple series, the Multiple Axes settings allow each series to be assigned to either the left or right axis. This is useful when displaying values that use different units or scales. The Inverted Data option reverses the orientation of the source data before rendering the chart. The Multiple Field setting can be used to group or filter chart data based on a selected field.

The Chart Type setting determines how the data is visualized. The Title field defines the chart title displayed above the visualization. The X Axis Label and Y Axis Label settings allow you to specify descriptive labels for the horizontal and vertical axes. Optional formatting can be applied through the X Axis Label Format and Y Axis Label Format settings.

The Height setting controls the height of the chart in pixels. The Legend setting determines the position of the chart legend or allows it to be hidden entirely. Available positions include Top, Bottom, Left, and Right. The Padding setting controls the spacing around the chart area and can be adjusted to improve readability and layout.

The Color Settings section allows you to customize the colors used by the chart. Individual colors can be assigned to chart series using the built-in color palette. Colors can be added, modified, or removed at any time to match application branding or reporting requirements.

Switch between Simple and Advanced Labels

Use Switch Control in the control header when you need to change between Simple and Advanced Label. Supported formatting is preserved during conversion, but this is not a guarantee that arbitrary custom HTML or every advanced construct has an equivalent Simple Label block.

Review the converted content, workbook-value placeholders, emphasis, tables, images, and links in Preview before publishing. Choose Advanced Label when the content requires its HTML-oriented editing capabilities; choose Simple Label when block-based editing fits the task.

Preview the content before publishing

Check disclosure expansion, Table of Contents links and tracking, table readability, dynamic workbook values, image crops and alt text, and inline emphasis. Review desktop and smaller-screen layouts and test meaningful keyboard interactions. Publish the draft only after the content and application behavior are ready.