Carousel
Release candidate
Carousel groups small amounts of content into discrete slides, that are viewed in a linear sequence.
Note: This tab list includes overflow; tab positions may be inaccurate or change when a tab is selected
- To enable more than one piece of content to occupy the same space.
- To navigate small amounts content, that are viewed in a linear sequence.
- To position information near the top of the viewable area.
- When content discovery and drawing attention is a priority for your product.
- To display less than 2 or more than 5 pieces of content.
- Include 5 or fewer slides. The most important slide always comes first.
- Indicate where the user is within the progression.
- On desktop, display prev/next buttons above the carousel.
- On mobile, display prev/next buttons below the carousel.
- Ensure that important content is also placed on another page of your site.
To import Carousel and related components from the lab Salt package, use:
| Name | Type | Description | Default |
|---|
| Name | Type | Description | Default |
|---|
| Name | Type | Description | Default |
|---|
| Name | Type | Description | Default |
|---|
- To enable more than one piece of content to occupy the same space.
- To navigate small amounts content, that are viewed in a linear sequence.
- To position information near the top of the viewable area.
- When content discovery and drawing attention is a priority for your product.
- To display less than 2 or more than 5 pieces of content.
- Include 5 or fewer slides. The most important slide always comes first.
- Indicate where the user is within the progression.
- On desktop, display prev/next buttons above the carousel.
- On mobile, display prev/next buttons below the carousel.
- Ensure that important content is also placed on another page of your site.
To import Carousel and related components from the lab Salt package, use:
| Name | Type | Description | Default |
|---|
| Name | Type | Description | Default |
|---|
| Name | Type | Description | Default |
|---|
| Name | Type | Description | Default |
|---|
- To enable more than one piece of content to occupy the same space.
- To navigate small amounts content, that are viewed in a linear sequence.
- To position information near the top of the viewable area.
- When content discovery and drawing attention is a priority for your product.
- To display less than 2 or more than 5 pieces of content.
- Include 5 or fewer slides. The most important slide always comes first.
- Indicate where the user is within the progression.
- On desktop, display prev/next buttons above the carousel.
- On mobile, display prev/next buttons below the carousel.
- Ensure that important content is also placed on another page of your site.
To import Carousel and related components from the lab Salt package, use:
| Name | Type | Description | Default |
|---|
| Name | Type | Description | Default |
|---|
| Name | Type | Description | Default |
|---|
| Name | Type | Description | Default |
|---|