Guide
Ready to make the move to Carbon v11? Our Migration Guide helps designers and developers learn more about this release and get started migrating to v11
Overview
Carbon v11 focuses on quality of life updates for designers and developers. This update includes:
- Changes to how we name our tokens to make them easier to use
- Improved theming to enable light and dark mode support in product
- The introduction of CSS Grid to build robust layouts on top of the 2x grid
- A 90% decrease in compilation for Styles from Carbon
- Updates to the accessibility of our components
With no changes to the IBM Design Language, v11 will not require any brand-driven product redesigns.
To learn more about what’s included in this release, check out our Changelog. To get started migrating, visit out our Getting started section below.
Getting started
Whether you are a designer or a developer, we have curated guidance ready for you as your team makes their migration. Dive in using one of the looks below to get started.
Changelog
The v11 release of Carbon is focused on improving the designer and developer experience of using Carbon. This release does not include any changes to the IBM Design Language and will not require any Product UIs to be visually redesigned.
This release also includes different compatability features to make it easy to use aspects of v10 in v11, such as color tokens.
To learn more about some of the high-level updates coming to Carbon, keep reading below. For a full reference of what has changed in this release, check out our v11 Migration Docs.
Theming
Design Kits
Package changes
Styles
React
New components
Icons
IBM Plex
What’s changing
- Theming
- Color tokens
- Type tokens
- CSS Custom Properties
- Light & Dark Mode
- Design Kit
- Package changes
- Styles
- Update to Dart Sass
- Update to Sass Modules
- Reduction in compile times
- React
- Component API changes
className
conventionssize
prop- Tabs
- Accessibility updates
- Notification
- Tooltip
- Icons
- Component API changes
- CSS Grid
- IBM Plex