Tile Select

Tile Select is a child component of Tile Select Group. Tile Selects are visually prominent containers that can be used as radio-style and checkbox-style selections.

Overview

Tile Selects are Tiles which can be used functionally like Radio Buttons or Checkboxes. This component is great for interactions when selections require clear headings and descriptions.

Consider Tile Select Group for layout builds.

Consider Tile for a non-selectable version of this component.

Usage

• Onboarding experiences
• Layout selection
• Format selection
• Visually prominent radio-style selection
• Visually prominent checkbox-style selections

Best practices

Below are important guidelines on using the Tile Select component.

Do use checkbox-style Tile Selects for choosing mutliple relevant items.

Avoid using the checkbox-style for common form interactions, and avoid forming questions in Tile Selects.

Do use Tile Selects when selections can benefit from descriptions to make a choice.

Avoid using Tile Selects for unconventional interactions like sorting.

Writing and copy

Text for Tile Selects should be on the shorter side, and as concise as possible.

• Use sentence case for heading and description
• End description with proper punctuation
• Avoid forming questions in Tile Selects
• Recommended heading character maximum: 50
• Recommended description character maximum: 175

API reference

Properties

Slots

Events

Methods