About cookies on this site Our websites require some cookies to function properly (required). In addition, other cookies may be used with your consent to analyze site usage, improve the user experience and for advertising. For more information, please review your options. By visiting our website, you agree to our processing of information as described in IBM’sprivacy statement. To provide a smooth navigation, your cookie preferences will be shared across the IBM web domains listed here.
Tile
Preview the tile component with the React live demo. For detailed code usage documentation, see the Storybooks for each framework below.
Documentation
Feature flags
Feature flags have been added to the clickable, selectable, and expandable variants of tile to improve accessibility and changes its visual appearance, not its functionality. For more code-specific feature flag information, refer to the @carbon/react framework.
- The
enable-experimental-tile-contrast
flag adds a border to the tile with improved contrast for accessibility and to visually indicate they are operable. - The
enable-v12-tile-default-icons
flag enables the rendering of default icons on the clickable variant of tile like the ArrowRight icon for navigation or Error icon when it is disabled if the user hasn’t configured a different icon already. - The
enable-v12-tile-default-icons
flag enables the rendering of default icons on the clickable variant of a tile, such as the ArrowRight icon for navigation or the Error icon when the tile is disabled. If the user hasn’t configured a different icon, these defaults will be used. - The
enable-v12-tile-radio-icons
flag changes RadioTile to use radio button icons instead of a checkmark icons.