Palette Reference

This is a reference for the components found on the Palette.

Content

Contains basic components for adding text, images and links to your designs.

  • Heading 1-4 – First through fourth-level heading text.
  • Paragraph – A paragraph of rich text.
  • Image – An image placeholder.
  • Hyperlink – A hyperlink.

Controls

Contains interactive controls used for building forms and application interfaces. Controls can respond to user interaction, similarly to the Automatic Navigation components.

Note: By default controls appear in the default style as determined by the web browser and operating system you are using. You can customize their appearance using the Appearance section of the Inspector.

  • Form Field Label – A text label for a form field.
  • Tooltip – A text tooltip.
  • Form Field – A single-line text form field.
  • Button – A button.
  • Drop Down Selection – A drop-down selection menu.
  • Checkbox – A checkbox.
  • Search Field – A form field styled for use as a search field.
  • Radio Button – A radio button.
  • Multiple-line Form Field – A multiple-line text form field.
  • File Upload – A file upload form field.

Boxes and Lines

Contains several box and line styles for quick sketching. All of the boxes can optionally contain text, which defaults to center-alignment for quick labeling.

  • Box – A box.
  • Rounded Box – A box with rounded corners.
  • Circle – An ellipse or circle.
  • Lines – Thin and thick horizontal and vertical lines.
  • Dark and Light Masks – Semi-transparent dark and light overlays, used to mask other content.
  • Placeholder – A box styled as a place-holding outline.

Automatic Navigation

Contains pre-configured navigation components that automatically link between pages or state values.

  • Horizontal and Vertical List Navigation – State-based navigation, pre-configured to switch between three items.
  • Horizontal and Vertical Tab Panels – A pre-configured 3-tabbed panel made up of state-based navigation and containers.
  • Previous and Next Links – Pre-configured links to the previous and next state values.
  • Current State Value Name – Displays the name of the current value of a state.

Containers

Contains several pre-configured containers.

  • Container – A basic container.
  • Scrolling Container – A container that is configured to allow scrolling when it contains large amounts of content.
  • Well Container – A container styled to appear sunken into the page.
  • Floating Container – A container styled to appear to float above the page. This is commonly used to create pop-up dialog boxes.

Advanced Content

Contains components used to display complex content that is beyond the scope of the components above.

Stencils and Widgets

Provides quick access to the Stencil and Widget Library, which contains thousands of additional pre-configured components and stencils. All items in the library are created from the same basic components above.