Components overview

A brief message that provides information or instructs users to take a specific action.

The annotation context is an invisible layer on top of the interface. It tracks the progress of a launched tutorial and feeds dynamic content to the Tutorial panel in Hands-on tutorials. It also renders annotation popovers and hotspot icons.

Provides the basic layout for all types of pages, including collapsible side navigation, tools panel, and split panel.

The area chart visualizes two or more series of data. Through stacked data series, it emphasizes the part-to-whole relationship of data over a period of time.

With the attribute editor, users can create, edit, and delete resource attributes.

An input that provides a list of suggestions that the user can choose from.

A small, color-coded visual element that contains letters or numbers, that you can use to label, categorize, or organize items.

Visualizes one or many series of data, with an emphasis on the total amount of each data point.

With the box component, you can display and style basic elements and containers in compliance with Cloudscape's typography and spacing strategy.

Displays a series of navigational links in a hierarchical list.

Allows users to initiate actions in the user interface.

With a button dropdown, you can group a set of actions under one button.

With the calendar component, users can select dates.

Represents a collection of resources.

A checkbox is a form element where users can make a binary choice.

With the code editor, users can write and edit code.

With collection preferences, users can manage their display preferences within a collection.

A select filter helps users find specific items in a collection of resources by choosing one or two properties.

Column layout helps you position content in columns.

With the container, you can present a group of pieces of content, indicating that the items are related. For example, a table is a type of container.

Provides the basic layout for the header and content of a page.

With copy to clipboard, users can copy content to their clipboard.

A form element in which a user can enter a date value.

With the date picker, users can enter or choose a date value.

With the date range picker, users can specify a date and time range. 

With expandable selection, users can expand or collapse a section. Use expandable sections when you have multiple sections on a page, and you want to allow users to see one or more sections at a time. Expandable sections are collapsed by default.

File upload is a form element. Users can use it to select one or multiple local files to upload. The files can then be uploaded upon form submission or processed further in the browser.

Displays one or more page-level flash notifications to communicate the status of a user’s action, such as success, failed, and so on.