Get started

Choose the path that suits your needs to start building with Cloudscape.

for designersfor designers

Get to know our system foundations, work with our patterns, and build with our components. Get access to our color palettes, icon sets, and sticker sheets in Figma.

for developmentfor development

Install packages, check out interactive playgrounds of our React components and patterns, and see how the system looks in practice with our coded demos.

Selected demos

Want to know what the system looks like in action? Below are demos that give you a preview. You can find all these in our demos section.

Service dashboardService dashboard

A dashboard page presents at-a-glance information about service and resource status. Users can monitor this information and act upon it quickly.

Table viewTable view

The table view pattern is a collection of resources in a tabular format. It's effective for quickly identifying categories or comparing values in a large text and numerical data set.

Density settingsDensity settings

The density settings pattern uses local storage to remember the user's preferred density setting. This pattern is for switching between comfortable and compact mode at the service level.

Single page createSingle page create

Use single page create if you want your users to create a resource on a single page. This component is optimized for simple to medium-complex forms.

Multipage create Multipage create

Use the multipage create, which employs the wizard component, when you want users to create resources by completing a set of interrelated tasks. We recommend multipage create for long or complex configurations.

Split view with detailsSplit view with details

An example of comparing key resource details within the split panel on a split view.